获取验证码按钮点击后,一分钟内不可继续点击

 1 <input type="button" id="btn" value="免费获取验证码" />
 2 <script type="text/javascript">
 3     var wait=60;
 4     function time(o) {
 5         if (wait == 0) {
 6             o.removeAttribute("disabled");
 7             o.value="免费获取验证码";
 8             wait = 60;
 9         } else {
10             o.setAttribute("disabled", true);
11             o.value="重新发送(" + wait + ")";
12             wait--;
13             setTimeout(function() {
14                 time(o)
15             },
16             1000)
17         }
18     }
19     document.getElementById("btn").onclick=function()
20     {time(this);}
21 </script>
时间: 2024-10-05 03:17:45

获取验证码按钮点击后,一分钟内不可继续点击的相关文章

Angular.js 使用获取验证码按钮实现-倒计时

获取验证码界面效果如图: 需要实现以下逻辑 按钮不可选 --输入电话号码,按钮可选 --点击获取,进入倒计时,按钮不可选 --倒计时结束,回到初识状态 核心代码: var cd = 60; var toDo = function() { cd--; $scope.countDown = "重新获取 " + cd; }; $interval(toDo, 1000, 60); 完整代码: html: <form name="form" class="fo

ios开发获取验证码按钮读秒效果

方法一: - (void)startCountDown { _seconds = 60; NSString *str = [NSString stringWithFormat:@"%d秒后可重新获取", _seconds]; [_btnVerify setTitle:str forState:UIControlStateDisabled]; [_btnVerify.titleLabel setFont:[UIFont systemFontOfSize:12]]; [_btnVerify

JS 获取验证码按钮改变案例

HTML代码 <div class="box"> <label for="">手机号</label> <input type="number"> <button>获取</button> </div> JS代码 1 var btn = document.querySelector('button') 2 var time = 10; 3 btn.addEventLi

前端学习——ionic/AngularJs——获取验证码倒计时按钮

 按钮功能为:点击"获取验证码"--按钮不可用-设置倒计时-60秒后重新获取. 代码借鉴于:http://plnkr.co/edit/Swj82MpJSix3a47jZRHP?p=preview 主要实现原理:点击后,设置一个$interval,每一秒更改一次剩余时间,并依赖Angular数据绑定实时显示在页面中.设置一个$timeout,60秒后将按钮初始化到可用状态. 实现代码: (1)js代码,设置成一个directive以便多次调用. angular.module('winwi

获取验证码倒计时优化 页面刷新实时倒计时

现在很多页面是需要获取验证码的,但是相信很多页面是没有做这样的优化的,比如下面这个场景: 现在访问一个注册页面,页面有一个填写手机号,获取验证码的按钮,点击获取验证码按钮之后,按钮变成灰色,然后是60倒计时效果.在60S内我无法再次点击获取验证码按钮.因为按钮是灰色的,不可点击状态. 但是,如果在倒计时任然进行时我刷新一下页面,一般的页面就会全部刷新,包括倒计时效果也没有了,按钮恢复到这最初可点击状态,这其实是不符合逻辑的.按正常逻辑是,页面任然倒计时,如果我刷新页面,倒计时任然存在,并且按钮不

Jquery插件 防刷新倒计时 “点击获取验证码后60秒内禁止重新获取

Jquery插件实现"点击获取验证码后60秒内禁止重新获取(防刷新)" 效果图: 先到官网(http://plugins.jQuery.com/cookie/)下载cookie插件,放到相应文件夹,代码如下: 1 <style type="text/css"> 2 * {margin: 0; 3 padding: 0; 4 font-family: "Microsoft Yahei"; 5 } 6 .captcha-box { 7 w

简单的“获取验证码”的按钮功能实现

p.p1 { margin: 0.0px 0.0px 0.0px 0.0px; font: 12.0px "PingFang SC" } p.p2 { margin: 0.0px 0.0px 0.0px 0.0px; font: 12.0px "PingFang SC"; min-height: 17.0px } p.p3 { margin: 0.0px 0.0px 0.0px 0.0px; font: 18.0px Menlo; color: #853e64 }

clips 前端 js 倒计时 获取验证码的按钮

1 <a href="javascript:void(0);" onclick="get_captcha()" class="btn btn-default btn6" id="for_captcha" >获取验证码</a> 2 3 <script type="text/javascript"> 4 5 var url="/get-verify-code?pho

对安卓获取验证码倒计时60秒Button按钮的简单封装

鉴于经常在注册获取验证码时候需要一个倒计时按钮觉得很麻烦,抽点时间写了一个TimeButton 键鼠下特性, TimeButton使用的时候跟普通Button一样没有冲突, TimeButton在倒计时的时候返回了如果没有超过剩下的时间再次进入会继续跑时哦, TimeButton里面完成了按钮的点击显示和倒计时逻辑, TimeButton在activity销毁后也会销毁不会像线程一样还在后台跑, TimeButton的显示文字和倒计时都可以自行设置当然也有默认的, 原创地址 http://wri