广

JavaScript

  • IOS开发
  • android开发
  • PHP编程
  • JavaScript
  • ASP.NET
  • ASP编程
  • JSP编程
  • Java编程
  • 易语言
  • Ruby编程
  • Perl编程
  • AJAX
  • 正则表达式
  • C语言
  • 编程开发

    JQuery实现按钮倒计时的方法

    2018-04-03 22:12:48 次阅读 稿源:互联网
    零七广告

    一个实现了在按钮上显示倒计时,倒计时完毕自动将按钮设置为不可用的效果,具体代码如下:

    1. <html> 
    2. <head>  
    3. <title>test count down button</title>  
    4. <script src="http://www.daimajiayuan.com/templets/skins/js/jquery-1.8.1.min.js" type="text/javascript"></script>  
    5. <script type="text/javascript">  
    6. $(function () {  
    7. $('#btn').click(function () {  
    8. var count = 3;  
    9. var countdown = setInterval(CountDown, 1000);  
    10.  
    11. function CountDown() {  
    12. $("#btn").attr("disabled", true);  
    13. $("#btn").val("Please wait " + count + " seconds!");  
    14. if (count == 0) {  
    15. $("#btn").val("Submit").removeAttr("disabled");  
    16. clearInterval(countdown);  
    17. }  
    18. count--;  
    19. }  
    20. })  
    21. });  
    22. </script>  
    23. </head>  
    24. <body>  
    25. <input type="button" id="btn" value="Submit" />  
    26. </body> 
    27. </html> 

    零七网部分新闻及文章转载自互联网,供读者交流和学习,若有涉及作者版权等问题请及时与我们联系,以便更正、删除或按规定办理。感谢所有提供资讯的网站,欢迎各类媒体与零七网进行文章共享合作。

    零七广告
    零七广告
    零七广告
    零七广告