JQuery实现倒计时按钮具体方法
更新时间：2013年11月14日 17:19:03 作者：
页面中需要实现某个按钮点击完后，禁用它，并显示倒计时。这个默认是3秒，代码如下
复制代码 代码如下:
<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实现展开关闭层的方法,实例分析了jQuery的slideToggle方法使用技巧,具有一定参考借鉴价值,需要的朋友可以参考下2015-02-02
jQuery的插件提供了一个很好的方法，节省了时间和简化了开发，避免程序员从头开始编写每个组件。但是，插件也将一个不稳定因素引入代码中。一个好的插件节省了无数的开发时间，一个质量不好的插件会导致修复错误的时间比实际从头 开始编写组件的时间还长。2014-09-09
这篇文章主要为大家详细介绍了jQuery实现图片跟随效果，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2021-08-08
这篇文章主要介绍了基于jquery实现发送文章到手机的代码,非常简单实用，需要的朋友可以参考下2014-12-12
这篇文章主要介绍了 基于Jquery easyui 选中特定的tab的相关资料,需要的朋友可以参考下2015-11-11
这篇文章主要介绍了jQuery对下拉框,单选框,多选框的操作需要的朋友可以过来参考下，希望对大家有所帮助2014-02-02
这篇文章主要介绍了jQuery实现页面顶部显示的进度条效果,以完整实例形式分析了jQuery基于animate与setTimeout定时触发实现进度条渐进显示功能,非常简单实用,需要的朋友可以参考下2015-12-12
这篇文章主要介绍了jQuery对象与DOM对象的转换方法,结合实例形式分析了jQuery对象及DOM对象的作用与二者的相互转换技巧,需要的朋友可以参考下2016-05-05
这篇文章主要介绍了jquery动态导航插件dynamicNav用法,较为详细的分析了jquery导航插件的原理及具体使用方法,具有一定参考借鉴价值,需要的朋友可以参考下2015-09-09
这里给大家分享的是使用jQuery实现列表内容的动态载入的特效，效果相当棒，后面附上瀑布流的实现思路和关键代码，有需要的小伙伴可以参考下。2015-08-08
最新评论