JavaScript实现短信发送时候的倒计时功能Demo
- 4515
- jQuery
- 10
- super_dodo
- 2016/03/30
在网站注册的时候,需要发送短信验证码,短信验证码一般都会延迟一下,所以当点击了该按钮后一般都会给一个倒计时的功能,一方面提示用户短信验证码的发送情况,一方面禁止用户短时间内重复点击造成不必要的开销和疑惑。先前想到用for循环,没有很顺畅。直接上代码段。各位小伙伴们自行领悟。方法里面执行本方法。
var wait = 60; //60秒倒计时 var isClick = 0; //是否已经点击过 function timeDesc() { //倒计时 if(wait == 0) { wait = 60; isClick = 0; $('#getSmsCode').text('获取验证码'); }else{ wait--; isClick = 1; $('#getSmsCode').text('重新获取'+wait); setTimeout(function(){timeDesc()},1000); } } //发送短信验证码--注册 $('#getSmsCode').click(function(){ if(isClick == '1'){ return false; } //禁止点击 var phone = $.trim($('#phone').val()); //用户名 if(!checkMobile(phone)){ alert("请输入正确的11位的手机号码"); $('#phone').focus(); return false; }else{ //是手机号码 var postUrl = 'codecodecodecodeurl'; $.getJSON(postUrl, {phone:phone}, function(json){ alert(json.msg); //弹出失败的提示信息--成功的时候再倒计时(需改进) timeDesc(); }); } return false; });
我走过最危险的路,就是你的套路!刚从绝望中走出来,又陷入另一个深渊。
相关阅读
- 通过Google API客户端访问Google Play帐户报告PHP库
- PHP执行文件的压缩和解压缩方法
- 消息中间件MQ与RabbitMQ面试题
- 如何搭建一个拖垮公司的技术架构?
- Yii2中ElasticSearch的使用示例
热门文章
- 通过Google API客户端访问Google Play帐户报告PHP库
- PHP执行文件的压缩和解压缩方法
- 消息中间件MQ与RabbitMQ面试题
- 如何搭建一个拖垮公司的技术架构?
- Yii2中ElasticSearch的使用示例
最新文章
- 通过Google API客户端访问Google Play帐户报告PHP库
- PHP执行文件的压缩和解压缩方法
- 消息中间件MQ与RabbitMQ面试题
- 如何搭建一个拖垮公司的技术架构?
- Yii2中ElasticSearch的使用示例