你的位置:首页 > Java教程

[Java教程]按钮倒计时指定秒数可用代码实例


按钮倒计时指定秒数可用代码实例:
有时候为了防止连续的点击按钮,可以采用这样的措施,当点击按钮之后,可以讲按钮禁用一段时间,并且以倒计时方式实现按钮的可用,下面就是一段能够实现此功能的代码实例,希望能够给需要的朋友带来帮助。
代码如下:

 

<!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content="http://www.softwhy.com/" /> <title>蚂蚁部落</title> <script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script> <script type="text/javascript"> var nn=30; var tipId; function show(){  tipId=setInterval("start()",1000); } function start(){  if(nn>0){   var vv="距离可用还有:(" + nn + ")";   $("#btn").attr("disabled", "disabled");  $("#btn").attr("value", vv);  nn--;  }  else{   nn=30;   $("#btn").removeAttr("disabled");  $("#btn").attr("value", "点下我");  clearInterval(tipId); } } $(document).ready(function(){ $("#btn").click(function(){  show() })})</script> </head> <body> <form> <input type="button" value="查看效果" id="btn"/> </form> </body> </html>

 

以上代码实现了我们的要求,点击按钮可以禁用按钮,并且倒计时30秒后才能够再可以点击,代码比较简单这里就不多介绍了,具体可以参阅相关阅读。
相关阅读:
1.setInterval()函数可以参阅setInterval()函数用法详解一章节。
2.attr()函数可以参阅jQuery的attr()方法一章节。 
3.removeAttr()函数可以参阅jQuery的removeAttr()方法一章节。 
4.clearInterval()函数可以参阅window对象的clearInterval()方法一章节。 

原文地址是:http://www.softwhy.com/forum.php?mod=viewthread&tid=12602

更多内容可以参阅:http://www.softwhy.com/jquery/