【设置第三次抽取的号码为 (张三6)】
<script language="javascript">
var k = 0 ;
function star(){
k++ ;
loop()
}
var t ;
var i ;
var bs =true ;
function loop(){
t = setTimeout( loop , 25 ) //时钟控件
var r = Math.random()*40
i = parseInt( r ) if( bs ){
$( $(".m")[i] ).css( "background-color" , "#ccff00" )
bs = false ;
}else {
$( $(".m") ).css( "background-color" , "#6666CC" )
bs = true ;
} } function stop(){
clearTimeout( t )
if( k==3 ){
$( $(".m") ).css( "background-color" , "#6666CC" )
$( $(".m")[5] ).css( "background-color" , "#ccff00" )
}else{
$( $(".m")[i] ).css( "background-color" , "#ccff00" )
}
}
</script>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>随机抽号程序</title>
<style type="text/css">
<!--
body {
background-attachment: scroll;
background-image: url(images/sjxh.jpg);
background-repeat: no-repeat;
background-position: right center;
background-color: #333333;
}
#title {
height: 25px;
width: 300px;
margin-right: auto;
margin-left: auto;
font-size: 25px;
font-weight: bolder;
color: #FFFFFF;
line-height: 25px;
margin-bottom: 50px;
margin-top: 20px;
}
#box {
height: 356px;
width: 890px;
margin-right: auto;
margin-left: auto;
}
#rmd {
width: 300px;
float: none;
clear: left;
}
#stop {
height: 50px;
width: 120px;
float: left;
font-size: 25px;
font-weight: bold;
color: #FFFFFF;
text-align: center;
vertical-align: middle;
line-height: 50px;
}
#star {
font-size: 25px;
line-height: 50px;
font-weight: bold;
color: #FFFFFF;
height: 50px;
width: 120px;
margin-right: auto;
margin-left: 35%;
text-align: center;
vertical-align: middle;
float: left;
}
#star a {
color: #FFFFFF;
text-decoration: none;
height: 50px;
width: 120px;
background-color: #33FF00;
display: block;
}
#stop a {
color: #FFFFFF;
text-decoration: none;
background-color: #FF0000;
display: block;
height: 50px;
width: 120px;
}
.m {
font-size: 22px;
line-height: 60px;
font-weight: bold;
color: #FFFFFF;
background-color: #6666CC;
text-align: center;
vertical-align: middle;
float: left;
height: 60px;
width: 100px;
margin: 5px;
font-family: "微软雅黑";
}
body,td,th {
font-family: 微软雅黑 Light;
font-size: 20px;
color: #FFFFFF;
font-weight: bold;
}
-->
</style>
</head>
<script language="javascript" src="js/jquery-1.10.2.min.js"></script>
<script language="javascript"> function star(){
loop()
}
var t ;
var i ;
var bs =true ;
function loop(){
t = setTimeout( loop , 25 ) //时钟控件
var r = Math.random()*40
i = parseInt( r ) if( bs ){
$( $(".m")[i] ).css( "background-color" , "#ccff00" )
bs = false ;
}else {
$( $(".m") ).css( "background-color" , "#6666CC" )
bs = true ;
} } function stop(){
clearTimeout( t )
$( $(".m")[i] ).css( "background-color" , "#ccff00" )
var rm = document.createElement('div');
rm.innerHTML = $( $(".m")[i] ).html();
document.body.appendChild(rm);
}
</script>
<body>
<div id="title">网站随机抽号程序</div>
<div id="box">
<div class="m">张三1</div>
<div class="m">张三2</div>
<div class="m">张三3</div>
<div class="m">张三4</div>
<div class="m">张三5</div>
<div class="m">张三6</div>
<div class="m">张三7</div>
<div class="m">张三8</div>
<div class="m">张三9</div>
<div class="m">张三10</div>
<div class="m">张三11</div>
<div class="m">张三12</div>
<div class="m">张三13</div>
<div class="m">张三14</div>
<div class="m">张三15</div>
<div class="m">张三16</div>
<div class="m">张三17</div>
<div class="m">张三18</div>
<div class="m">张三19</div>
<div class="m">张三20</div>
<div class="m">张三21</div>
<div class="m">张三22</div>
<div class="m">张三23</div>
<div class="m">张三24</div>
<div class="m">张三25</div>
<div class="m">张三26</div>
<div class="m">张三27</div>
<div class="m">张三28</div>
<div class="m">张三29</div>
<div class="m">张三30</div>
<div class="m">张三31</div>
<div class="m">张三32</div>
<div class="m">张三33</div>
<div class="m">张三34</div>
<div class="m">张三35</div>
<div class="m">张三36</div>
<div class="m">张三37</div>
<div class="m">张三38</div>
<div class="m">张三39</div>
<div class="m">张三40</div> </div>
<div id="star"><a href="#" onclick="star()">开始</a></div>
<div id="stop"><a href="#" onclick="stop()">停止</a></div>
<div id="rmd"></div>
</body>
</html>

HTML + JS随机抽号。的更多相关文章

  1. js 随机生成姓名、手机号、身份证号、银行卡号

    开发测试的时候,经常需要填写姓名.手机号.身份证号.银行卡号,既要符合格式要求.又不能重复.大家会到网上搜各种生成器.能不能自己写一个简单的生成器呢.下面是随机生成姓名.手机号.身份证号.银行卡号的j ...

  2. ppt VBA 实现随机抽题

    目录 目标/最终效果 关于VBA VBA简单示例 检查环境 步骤 VBA实现随机抽题 todo challenge 目标/最终效果 目标是制作一个ppt,实现随机抽题,具体描述: 第一页幻灯片中:点击 ...

  3. Java用n种方法编写实现双色球随机摇号案例

    方法清单 规则 实现方式一 实现方式二 实现方式三 实现方式四 实现方法五 之前我用JavaScript编写过一个实现双色球随机摇号的案例, 点击此处查看,今天我再用Java语言来实现这一效果. 规则 ...

  4. js 随机星星 document.createElement(); setAttribute()

    js 随机星星 document.createElement(); setAttribute() <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1. ...

  5. js随机更换

    如果想实现“随机”切换图像,那么我们要使用到几个Math()对象 第一个是random()函数,函数的功能是产生随机数,如果书写为 var a=Math.random() 那么所产生的随机数是0-1( ...

  6. js验证身份证号,超准确

    js验证身份证号,超准确 看程序前先来了解下身份证号的构成:身份证号分为两种,旧的为15位,新的为18位.身份证15位编码规则:dddddd yymmdd xx p    其中 dddddd:地区码  ...

  7. JS随机生成不重复数据的代码分享

    JS随机生成不重复数据. 代码如下: <script> // 定义存放生成随机数的数组 var array=new Array(); // 循环N次生成随机数 for(var i = 0 ...

  8. highlight.js 设置行号

    原文地址:highlight.js 设置行号 博客地址:http://www.extlight.com 一.背景 笔者在开发这套博客系统时使用 Editormd 作为 Markdown 编辑器,由于不 ...

  9. 实现纸牌游戏的随机抽牌洗牌过程(item系列几个内置方法的实例)

    实现纸牌游戏的随机抽牌洗牌过程(item系列几个内置方法的实例) 1.namedtuple:命名元组,可以创建一个没有方法只有属性的类 from collections import namedtup ...

随机推荐

  1. 一般html5 手机端头部需要

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

  2. 安装JDK,Python SDK及环境变量的配置

    JDK 首先是下载安装包 http://pan.baidu.com/share/link?shareid=3261115669&uk=369127748 一般JDK和Jre是一起安装的,提醒大 ...

  3. TCP协议学习记录 (三) Ping程序 RR选项 记录路由hop

    一开始想直接在上个程序改,自己构造IP包头,但后来发现不行,微软不让干了,所以后来选用libcap库来收发包 代码写的很乱.. #pragma pack(4) #define ECHO_REQUEST ...

  4. 【Debian】非法关机后无法联网 connect: network is unreachable

    某一天,突然发现无法ssh登录虚拟机内的debian系统,一直认为是ssh的问题,然后无意间ping了ping百度,发现原来是debian系统没有联网....囧 首先,是虚拟机的网络设置检查. 打开V ...

  5. ue4 Worldmachine 结合使用

    最近项目需求制作一个场景的远景部分.正好可以尝试使用一下UE4的 Landscape.不过直接在 Editor 里刷地形工作量太大,刷出的地形也不真实,最关键的是 Landscape 的工具并不是那么 ...

  6. OPENWRT开始SFTP支持办法

    root@OpenWrt:~# opkg update root@OpenWrt:~# opkg install vsftpd openssh-sftp-server root@OpenWrt:~# ...

  7. MVC 之 Code First

    在我们的工作和学习当中,经常会遇到中小型项目,这些项目除了业务上的区别较大 外,对于底层和数据访问,其实都差不多.记得以前做项目时,每次都要重复的写底层操作数据库的代码,不仅浪费时间,也无太大意思,后 ...

  8. Chocolatey

    知乎上有人提到如何节省时间, 1.自动化 2.批量化 Chocolatey (https://chocolatey.org/)是一个自动化程序安装工具.今天试用了一下 ,想想每年因为安装软件而损失的时 ...

  9. 基于Socket客户端局域网或广域网内共享同一短信猫收发短信的开发解决方案

    可使同一网络(局域网或广域网)内众多客户端,共享一个短信猫设备短信服务器进行短信收发,短信服务器具备对客户端的管理功能. 下面是某市建设银行采用本短信二次开发平台时实施的系统方案图: 在该方案中,考虑 ...

  10. Oracle 安装及其遇到的问题

    Oracle安装过程其实有很多的文档可以参考. 以oracle11g release版本为例: 从官网下载下来的zip ,包含两个部分,win32_11gR2_database_1of2.zip 以及 ...