setTimeout倒计时效果代码

2018-1-11 11:56| 发布者: antzone| 查看: 891| 评论: 0|来自: 蚂蚁部落

多数情况,倒计时使用setInterval方法实现,此方法不间断的执行,而setTimeout方法只能够执行一次,通过递归的方式也可以实现倒计时功能,代码实例如下:

[HTML] 纯文本查看 复制代码运行代码
<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.softwhy.com/" />
<title>蚂蚁部落</title>
<script type="text/javascript"> 
function timer(){ 
  var value=Number(document.all['timer'].value); 
  if(value>1){
    document.all['timer'].value=value-1; 
  } 
  else { 
    document.all['timer'].value="同意"; 
    return false; 
  } 
  window.setTimeout("timer()",1000); 
} 
window.onload=function(){timer()}
</script> 
</head> 
<body> 
<input name="timer" value="10" type="button"/> 
</body> 
</html>

尽管setTimeout只能够执行一次,但是可以使用递归的方式,不断的调用自身。

相关阅读:

(1).Number()参阅javascript Number()一章节。 

(2).setTimeout()参阅window setTimeout()一章节。

(3).document.all参阅javascript document.all一章节。


鲜花

握手

雷人

路过

鸡蛋

最新评论

返回顶部