jquery 实现点击按钮后出现倒计时效果(用于实现发送手机验证码、邮箱验证码)
<!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 = 30; //间隔函数,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: "json", //数据格式: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 实现 点击按钮后倒计时效果,多用于实现发送手机验证码、邮箱验证码
原文链接:http://www.cnblogs.com/steed-zgf/archive/2012/02/03/2336984.html <!DOCTYPE html PUBLIC " ...
- js jquery 实现点击按钮后,倒计时60秒才能再次点击发送验证邮件
<input type="button" id="btn" value="免费获取验证码" /><script type= ...
- 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 ...
- Java基础 awt Button 点击按钮后在控制台输出文字
JDK :OpenJDK-11 OS :CentOS 7.6.1810 IDE :Eclipse 2019‑03 typesetting :Markdown code ...
- jquery实现点击按钮弹出层和点击空白处隐藏层
昨天做项目遇到一个问题,和大家分享下,jquery实现点击按钮弹出层和点击空白处隐藏层的问题 if($('.autoBtn').length){ $('.autoBtn' ...
- 如何让Web程序在点击按钮后出现如执行批处理程序般的效果
在cli程序中,输入命令得到连续的输出已经是一种进度而美观的页面交互形式,好比下图: 而web程序里也有类似的场景,比如执行一个耗时任务,除了显示出等待图标外,用户还希望把执行的状态及时显示出来.如下 ...
- 基于jQuery鼠标点击弹出登陆框效果
基于jQuery鼠标点击弹出登陆框效果.这是一款扁平样式风格的jQuery弹出层登陆框特效.效果图如下: 在线预览 源码下载 实现的代码. html代码: <input type=" ...
随机推荐
- python扩展
补充一些有趣的知识 1. sys模块方法的补充,打印进度条 import sys,time for i in range(20): sys.stdout.write("#") sy ...
- linux -- ubuntu修改IP地址、网关、dns
ubuntu系统 一.使用命令设置Ubuntu IP地址 1.修改配置文件blacklist.conf禁用IPV6 sudo vi /etc/modprobe.d/blacklist.conf 表示用 ...
- android2.2应用开发之IccCard(sim卡或USIM卡)(转至 http://www.2cto.com/kf/201306/223784.html)
如果要做android通讯录的联系人的机卡混排显示,由于手机卡类型的不同,导致手机卡存储容量以及可以存储信息不同,就要涉及到android去读Icc卡的信息. 一般的sim卡只能存储姓名跟一个电话号码 ...
- 从头认识java-18.2 主要的线程机制(7)join
这一章节我们来讨论一下join. 1.什么是join? 阻塞当前线程,让.join的线程先做完.然后再继续当前线程 以下是api的解释: A.join,在API中的解释是,阻塞当前线程B,直到A运行完 ...
- 转载:erlang程序优化点的总结
erlang程序优化点的总结(持续更新) 转自:http://wqtn22.iteye.com/blog/1820587 转载请注明出处 注意,这里只是给出一个总结,具体性能需要根据实际环境和需要来确 ...
- MySQL(五)之DDL(数据定义语言)与六大约束
前言 前面在数据库的讲解中,其实很多东西都非常的细节,在以前的学习过程中我都是没有注意到的.可能在以后的工作中会碰到所以都是做了记录的. 接下来,我将分享的是MySQL的DDL用来对数据库及表进行操作 ...
- jpa动态分页查找
https://my.oschina.net/buwei/blog/172402 http://www.cnblogs.com/derry9005/p/6282571.html http://2560 ...
- Java基础--常用IO流使用实例
读取文本文件: private static void ioDemo1() { try { FileReader fileReader = new FileReader("C:\\Users ...
- windows,cmd中查看当前目录下的文件及文件夹
需求描述: 在使用cmd的过程中,有的时候需要查看当前目录下有哪些文件或者文件夹,类似linux下的ls命令 操作过程: 1.通过dir命令查看当前目录下有哪些的文件及文件夹 备注:通过dir命令,就 ...
- MAC快捷键使用大全
当写到标题的时候.突然想起刚接触电脑的时候总是会有一些window希统快捷键大全.foxmail快捷键使用大全,最没想到的是,作为一个说不上资深.也是有了年头的程序猿,到现在.我还要在写一个快捷键使用 ...