如题,以现学习阶段思想能解决不
这个怎么样:
<!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> <script type="text/javascript"> var num=0; var i; var n=true; function st(){ document.getElementById("txt").value=num; num=num+1; i=setTimeout("st()",1000); } function startCount(){ if(n==true){//n初始值为true,可以执行以下代码,执行到n=false停止 clearTimeout(i);//这里当第一次循环完毕再次开始,clearTimeout(i)只是让计时器停止 num=0;//而为了再次重新开始计时,必须把初始值再次重置设置为0;下面的函数同样的道理 setTimeout("st()",1000); n=false; } } function stopCount(){ if(n==false){//当n=false,执行以下代码,执行到n=true停止 clearTimeout(i); num=0; setTimeout("st()",1000); // clearTimeout(i); n=true;//而当n=true;再次执行startCount()函数,按照如此单一的循环模式, //不会再出现多次点击start出现计时加速的现象 } } </script> <style type="text/css"> *{padding:0; margin:0; font-size:24px; color:#F00;} #txt{text-align:center;} /*#tim{ width:200px; margin:200px auto;}*//*这里因为宽度设置太小,才是导致上下分段的原因*/ #tim{ width:400px; margin:200px auto;} input{color: #C33; font-size:24px; font-family:"华文隶书"; font-weight:bold;} </style> </head> <body> <form> <div id="tim"> <input type="button" value="start" onclick="startCount()" /> <input type="text" id="txt" /> <input type="button" value="start" onclick="stopCount()" /> </div> </form> </body> </html>
var num=0;
var i;
function startCount(){
document.getElementById('count').value=num;
num=num+1;
i=setTimeout(startCount,1000);
}
function stopCount(){
clearTimeout(i);
num=0;
}
记得采纳哦