jquery 实现 点击按钮后倒计时效果,多用于实现发送手机验证码、邮箱验证码
原文链接:http://www.cnblogs.com/steed-zgf/archive/2012/02/03/2336984.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script src="HTML/js/jquery-1.4.1.min.js" type="text/javascript"></script>
<script type="text/javascript"> var InterValObj; //timer变量,控制时间
var count = 5; //间隔函数,1秒执行
var curCount;//当前剩余秒数 function sendMessage() {
curCount = count;
//设置button效果,开始计时
$("#btnSendCode").attr("disabled", "true");
$("#btnSendCode").val("请在" + curCount + "秒内输入验证码");
InterValObj = window.setInterval(SetRemainTime, 1000); //启动计时器,1秒执行一次
//向后台发送处理数据
$.ajax({
type: "POST", //用POST方式传输
dataType: "text", //数据格式:JSON
url: 'Login.ashx', //目标地址
data: "dealType=" + dealType +"&uid=" + uid + "&code=" + code,
error: function (XMLHttpRequest, textStatus, errorThrown) { },
success: function (msg){ }
});
} //timer处理函数
function SetRemainTime() {
if (curCount == 0) {
window.clearInterval(InterValObj);//停止计时器
$("#btnSendCode").removeAttr("disabled");//启用按钮
$("#btnSendCode").val("重新发送验证码");
}
else {
curCount--;
$("#btnSendCode").val("请在" + curCount + "秒内输入验证码");
}
}
</script>
</head>
<body>
<input id="btnSendCode" type="button" value="发送验证码" onclick="sendMessage()" /></p>
</body>
</html>

jquery 实现 点击按钮后倒计时效果,多用于实现发送手机验证码、邮箱验证码的更多相关文章
- jquery 实现点击按钮后出现倒计时效果(用于实现发送手机验证码、邮箱验证码)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- js jquery 实现点击按钮后,倒计时60秒才能再次点击发送验证邮件
<input type="button" id="btn" value="免费获取验证码" /><script type= ...
- jq实现点击按钮后倒计时,多用于手机验证
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 如何让Web程序在点击按钮后出现如执行批处理程序般的效果
在cli程序中,输入命令得到连续的输出已经是一种进度而美观的页面交互形式,好比下图: 而web程序里也有类似的场景,比如执行一个耗时任务,除了显示出等待图标外,用户还希望把执行的状态及时显示出来.如下 ...
- response 后刷新页面,点击按钮后,禁用该按钮
一,正常的点击按钮后,将其灰显,全部执行完毕再正常显示. this.btnSave.Attributes.Add("onclick", "if (typeof(Page_ ...
- TProcedure,TMethod,TNotifyEvent,TWndMethod的区别,并模拟点击按钮后发生的动作
忽然发现TProcedure和TNotifEvent的区别还挺大的: procedure TForm1.Button2Click(Sender: TObject); begin ShowMessage ...
- JQuery实现点击按钮切换图片(附源码)--JQuery基础
JQuery实现切换图片相对比较简单,直接贴代码了哈,有注释噢!疑问请追加评论哈,不足之处还请大佬们指出! 1.案例代码: demo.html: <!DOCTYPE html><ht ...
- 基于jquery鼠标点击图片翻开切换效果
基于jquery鼠标点击图片翻开切换效果是一款基于jQuery+CSS3实现的点击图片切换特效.效果图如下: 在线预览 源码下载 实现的代码. html代码: <div class=&quo ...
- Java基础 awt Button 点击按钮后在控制台输出文字
JDK :OpenJDK-11 OS :CentOS 7.6.1810 IDE :Eclipse 2019‑03 typesetting :Markdown code ...
随机推荐
- [HDOJ5787]K-wolf Number(数位DP)
题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=5787 题意:求[L,R]区间内的数字,使得所有长度为k的子数列内所有数位都不同. K<=5的所以 ...
- C# 导出数据至 CSV
有时候将Excel的数据另存到csv文件会出现csv格式错误,以下示例实现将DataTable里面的数据直接保存到csv文件. System.Web.HttpRuntime.Cache["v ...
- CA*Layer(CAReplicatorLayer--)
CAReplicatorLayer (反射应用) 指定一个继承于UIView的ReflectionView,它会自动产生内容的反射效果: + (Class)layerClass//我们也可以通过重写V ...
- HDU 5833 Zhu and 772002
HDU 5833 Zhu and 772002 Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/65536 K (Java/ ...
- Redis 在新浪微博中的应用
Redis 在新浪微博中的应用 Redis简介 1. 支持5种数据结构 支持strings, hashes, lists, sets, sorted setsstring是很好的存储方式,用来做计数存 ...
- 从xubuntu-->windows xp
捣鼓了两个月的ubuntu之后我又乖乖的回到了windows的怀抱,不是抛弃linux而是要适应身边的环境. 身边的板子的驱动基本上都是xp的老一点的还是vista的,让人情何以堪. 我努力克服了,用 ...
- 未能加载文件或程序集“SQLDAL”或它的某一个依赖项。系统找不到指定的文件
1. 检查是否SQLDAL.DLL这个程序集文件是否存在,是否在Debug目录下(如果你是在Debug模式下调试).或者看看是否是配置文件中的名称和实际的dll的名称不对应. 2. 你使用的是Asse ...
- FLASH CC 2015 CANVAS 中 gotoAndStop、gotoAndPlay() 不起作用
哎 话不多说先看我的代码: //舞台上 放着sp0.sp1....sp8,9个mc,每个mc都有几帧, //帧上有如下代码 var S=this; S.stop() inIt1();//not wor ...
- [转载] MySQL高可用方案选型参考
原文: http://imysql.com/2015/09/14/solutions-of-mysql-ha.shtml?hmsr=toutiao.io&utm_medium=toutiao. ...
- [转载] tcp那些事2
原文: http://coolshell.cn/articles/11609.html 这篇文章是下篇,所以如果你对TCP不熟悉的话,还请你先看看上篇<TCP的那些事儿(上)> 上篇中,我 ...