编程 Javascript

JQuery实现倒计时按钮具体方法

Posted in Javascript onNovember 14, 2013

<head>
    <title>test count down button</title>
    <script src="http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.5.1.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function () {
            $('#btn').click(function () {
                var count = 3;
                var countdown = setInterval(CountDown, 1000);
                function CountDown() {
                    $("#btn").attr("disabled", true);
                    $("#btn").val("Please wait " + count + " seconds!");
                    if (count == 0) {
                        $("#btn").val("Submit").removeAttr("disabled");
                        clearInterval(countdown);
                    }
                    count--;
                }
            })
        });
   </script>
</head>
<body>
<input type="button" id="btn" value="Submit" />
</body>

有兴趣您可以自己实现一下。

JQuery实现倒计时按钮具体方法

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

[原创]js与自动伸缩图片自动缩小图片的多浏览器兼容的方法总结

Mar 12 Javascript

JS创建优美的页面滑动块效果 - Glider.js

Sep 27 Javascript

jquery DOM操作基于命令改变页面

May 06 Javascript

Jquery下:nth-child(an+b)的使用注意

May 28 Javascript

javascript 兼容所有浏览器的DOM扩展功能

Aug 01 Javascript

javascript 获取网页标题代码实例

Jan 22 Javascript

iframe窗口高度自适应的又一个巧妙实现思路

Apr 04 Javascript

jQuery easyui的validatebox校验规则扩展及easyui校验框validatebox用法

Jan 18 Javascript

深入理解jQuery 事件处理

Jun 14 Javascript

JS 动态加载js文件和css文件同步/异步的两种简单方式

Sep 23 Javascript

详解js的延迟对象、跨域、模板引擎、弹出层、AJAX【附实例下载】

Dec 19 Javascript

vue-cli3搭建项目的详细步骤

Dec 05 Javascript

jquery动态增加删除表格行的小例子

Nov 14 #Javascript

js取消单选按钮选中并判断对象是否为空

Nov 14 #Javascript

Javascript call和apply区别及使用方法

Nov 14 #Javascript

javascript 上下banner替换具体实现

Nov 14 #Javascript

javascript scrollTop正解使用方法

Nov 14 #Javascript

简单的Jquery遮罩层代码实例

Nov 14 #Javascript

Extjs改变树节点的勾选状态点击按钮将复选框去掉

Nov 14 #Javascript