发送短信验证码后60秒倒计时

最新推荐文章于 2024-08-17 14:22:19 发布

weixin_33962621

最新推荐文章于 2024-08-17 14:22:19 发布

阅读量124

点赞数

文章标签： php java javascript ViewUI

原文链接：http://www.cnblogs.com/seeto/p/10092652.html

版权

jquery实现的发送短信验证码后60秒倒计时功能，完整实例可到http://smsow.zhenzikj.com/doc/sdk.html 下载"注册验证码"的demo。

直接下载:
java版: http://smsow.zhenzikj.com/demo/download.html?fileName=zhenzisms_java_demo

php版: http://smsow.zhenzikj.com/demo/download.html?fileName=zhenzisms_php_demo

效果图:

javascript源码

//短信验证码倒计时
	var countdownHandler = function(){
		var $button = $(".sendVerifyCode");
		var number = 60;
		var countdown = function(){
			if (number == 0) {
				$button.attr("disabled",false);
				$button.html("发送验证码");
	            number = 60;
	            return;
	        } else {
	        	$button.attr("disabled",true);
	        	$button.html(number + "秒 重新发送");
	        	number--;
	        }
			setTimeout(countdown,1000);
		}
		setTimeout(countdown,1000);
	}

　　html源码

<body>
   <form>
       <div class="row">
           <label>账号: </label><input name="userId">
       </div>
       <div class="row">
           <label>密码:</label><input name="password">
       </div>
       <div class="row">
           <label>手机号:</label><input name="mobile">
       </div>
       <div class="row">
           <label>验证码:</label>
           <input name="verifyCode">
           <button type="button" class="sendVerifyCode">获取短信验证码</button>
       </div>
       <div><button type="button" class="sub-btn">提交</button></div>
   </form>
</body>

转载于:https://www.cnblogs.com/seeto/p/10092652.html

weixin_33962621

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
发送短信验证码后60秒倒计时

jquery实现的发送短信验证码后60秒倒计时功能，完整实例可到http://smsow.zhenzikj.com/doc/sdk.html下载"注册验证码"的demo。直接下载:java版:http://smsow.zhenzikj.com/demo/download.html?fileName=zhenzisms_java_demophp版:http://smsow.zhenzi...
复制链接

扫一扫