setTimeout(), clearTimeout()
Posted 脑袋空空空想家
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了setTimeout(), clearTimeout()相关的知识，希望对你有一定的参考价值。
今天学了setTimeout(), clearTimeout() ，想到可以做一个计时器。先给自己马一下
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>计时器</title> 6 <script> 7 8 var num =0; 9 var i; 10 function startCount(){ 11 //文本框的值赋给num 12 document.getElementById(‘count‘).value =num; 13 num += 1; 14 i =setTimeout("startCount()",1000); 15 } 16 17 function stopCount(){ 18 clearTimeout(i); 19 } 20 </script> 21 22 23 </head> 24 <body> 25 <input type="text" id="count"/> 26 <input type="button" value="继续" onclick="startCount()"/> 27 <input type="button" value="暂停" onclick="stopCount()"> 28 29 </body> 30 </html>
有一点就是，刚开始进去必须点一下继续才开始计时，研究一下看看怎么解决吧。
还可以做购物车添加物件，数量增加的效果：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>购物车效果</title>
<script>
var num =1;
function startCount(){
//文本框的值赋给num
document.getElementById(‘count‘).value =num;
num += 1;
setTimeout("startCount()",1000);
}
</script>
</head>
<body>
<input type="text" id="count"/>
<input type="button" value="添加" onclick="startCount()"/>
</body>
</html>
以上是关于setTimeout(), clearTimeout()的主要内容，如果未能解决你的问题，请参考以下文章
JavaScript：在另一个 setTimeOut（嵌套 setTimeOut）中的 setTimeOut 以刺激 API 响应不起作用
关于setTimeout()你所不知道的地方,详解setTimeout()