一、 <html><head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/> <meta http-eq
一、
<html><head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/> <meta http-equiv="Content-Language" content="zh-CN"/> <title>抽奖</title> <script src="http://lib.sinaapp.com/js/jquery/1.9.1/jquery-1.9.1.min.js"></script> <style type="text/css"> body {text-align:center;padding-top:50px;} #Result {border:3px solid #40AA53;margin:0 auto;text-align:center;width:400px;padding:50px 0;background:#efe;} #ResultNum {font-size:50pt;font-family:Verdana} #Button {margin:50px 0 0 0;} #Button input {font-size:40px;padding:0 50px;} </style> <script type='text/javascript'> <!-- var g_Interval = 10; var g_PersonCount = 100;//参加抽奖人数 var g_Timer; var running = false; function beginRndNum(trigger){ if(running){ running = false; clearTimeout(g_Timer); $(trigger).val("开始"); $('#ResultNum').css('color','red'); } else{ running = true; $('#ResultNum').css('color','black'); $(trigger).val("停止"); beginTimer(); } } function updateRndNum(){ var num = Math.floor(Math.random()*g_PersonCount+1); $('#ResultNum').html(num); } function beginTimer(){ g_Timer = setTimeout(beat, g_Interval); } function beat() { g_Timer = setTimeout(beat, g_Interval); updateRndNum(); } //--> </script></head><body><h1>抽奖结果</h1><div id="Result"> <span id="ResultNum">0</span></div><div id="Button"><input type='button' value='开始' onclick='beginRndNum(this)'/></div></body></html>
二、setInterval () 更简洁
<html><head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/> <meta http-equiv="Content-Language" content="zh-CN"/> <title>抽奖</title> <script src="http://lib.sinaapp.com/js/jquery/1.9.1/jquery-1.9.1.min.js"></script> <style type="text/css"> body {text-align:center;padding-top:50px;} #Result {border:3px solid #40AA53;margin:0 auto;text-align:center;width:400px;padding:50px 0;background:#efe;} #ResultNum {font-size:50pt;font-family:Verdana} #Button {margin:50px 0 0 0;} #Button input {font-size:40px;padding:0 50px;} </style> <script type='text/javascript'> var g_Interval = 10; var g_PersonCount = 100;//参加抽奖人数 var g_Timer; var running = false; function beginRndNum(trigger){ if(running){ running = false; clearInterval(g_Timer); $(trigger).val("开始"); $('#ResultNum').css('color','red'); }else{ running = true; $('#ResultNum').css('color','black'); $(trigger).val("停止"); g_Timer = setInterval(updateRndNum, g_Interval); } } function updateRndNum(){ var num = Math.floor(Math.random()*g_PersonCount+1); $('#ResultNum').html(num); } </script></head><body><h1>抽奖结果</h1><div id="Result"> <span id="ResultNum">0</span></div><div id="Button"><input type='button' value='开始' onclick='beginRndNum(this)'/></div></body></html>