js实现获取验证码时60s后再次发送

我们在做注册或登陆的页面时经常有获取验证码的功能，在获取验证码时我们经常要做个60s禁止点击的功能，下面是我做项目时经常用到的代码：

例子

获取验证的按钮：

 代码如下 复制代码

<input class="get" type="button" value="获取验证码" />;

获取验证码的Ajax函数：

$(".get").on('click',function(){
var btn=$(this);
var phone = $(".phone").val();
var data = {phone: phone, type: 1};
 
if(!phone || !eval('/'+regexEnum.mobile+'/').test(phone)
|| phone.length &amp;lt; 11){
alert("手机号格式不正确!");
return;
}
// ajax 获取验证码
ajaxPOSTRequest(kBaseUserUrl + "getPhoneSalt", data, handleCaptcha);
function handleCaptcha(result) {
ZMAlert(result.message['content']);
if(result.errorCode == 0){
settime(btn);
}
}
});

倒计时60s的函数：

 代码如下 复制代码
var countdown=60;
function settime(val) {
if (countdown == 0) {
val.attr("disabled", false);
val.val("重新发送");
val.css({
"background":"#fe8836"
});
countdown = 60;
return false;
} else {
val.attr("disabled", true);
val.val("正在获取"+countdown);
val.css({
"background":"#ccc"
});
countdown--;
}
setTimeout(function() {
settime(val)
},1000)
}

 

例子1

 代码如下 复制代码

javascriptvar getCode = document.getElementById('getCode');
var wait = 60;
function time(btn){
    if (wait===0) {
        btn.removeAttribute("disabled");
        btn.innerHTML = "获取验证码";
        wait = 60;
    }else{
        btn.setAttribute("disabled",true);
        btn.innerHTML = wait + "秒后重试";
        wait--;
        setTimeout(function(){
            time(btn);
        },1000);
    }
}
getCode.onclick = function(){
    time(this);
};
时间： 2024-09-16 12:28:13

js实现获取验证码时60s后再次发送的相关文章

httpclient-关于HttpClient问题。为什么安卓获取验证码时，得到的是乱码的验证码信息？

问题描述 关于HttpClient问题.为什么安卓获取验证码时,得到的是乱码的验证码信息? 这样能正确获取验证码 package com.example.day51; import java.util.ArrayList; import java.util.HashMap; import java.util.Iterator; import java.util.List; import java.util.Set; import org.apache.http.HttpResponse; imp

php中用curl获取验证码时同时获取cookies乱码

问题描述 php中用curl获取验证码时同时获取cookies乱码 我用curl获取验证码时同时想获取cookies信息但是乱码. curl获取时头信息时"Content-Type: text/html;"这个导致了乱码. 请问怎么解决,让验证码显示同时也能输出cookies? 解决方案 csdn中有人写过这样的博客 原文链接:http://blog.csdn.net/ashelyhss/article/details/7916970 自己去看看

JS获取年月日时分秒的方法分析_javascript技巧

本文实例分析了JS获取年月日时分秒的方法.分享给大家供大家参考,具体如下: var d = new Date(); var time = d.getFullYear() + "-" +(d.getMonth()+1) + "-" + d.getDate() + " " + d.getHours() + ":" + d.getMinutes() + ":" + d.getSeconds(); 必须这么繁杂,没

Andorid实现点击获取验证码倒计时效果_Android

我们在开发中经常用到倒计时的功能,比如发送验证码后,倒计时60s再进行验证码的获取,为了方便以后使用,这里做个记录,讲讲倒计时器的实现.  1.先进行倒计时工具类的封装  public class CountDownTimerUtils extends CountDownTimer { private TextView mTextView; /** * @param textView The TextView * * * @param millisInFuture The number of m

JS短信验证码倒计时功能的实现（没有验证码，只有倒计时）_javascript技巧

1.功能描述 当用户想要获取验证码时,就点击 免费获取验证码 ,然后开始倒计时,倒计时期间按钮文字为剩余时间x秒,且不可按状态,倒计时结束后,按钮更改为点击重新发送. 2.分析 必须用到定时器.按钮点击后,在定时器内做出判断.倒计时60秒,到0结束. 3.代码实现: 重点介绍:定时器在进行下一次倒计时之前,一定要清除一下,这样的话保证下一次定时器倒计时是正常的. <!DOCTYPE html> <html> <head> <meta charset="U

Andorid实现点击获取验证码倒计时效果

我们在开发中经常用到倒计时的功能,比如发送验证码后,倒计时60s再进行验证码的获取,为了方便以后使用,这里做个记录,讲讲倒计时器的实现. 1.先进行倒计时工具类的封装 public class CountDownTimerUtils extends CountDownTimer { private TextView mTextView; /** * @param textView The TextView * * * @param millisInFuture The number of mil

Android Demo手机获取验证码

       注册很多app或者网络账户的时候,经常需要手机获取验证码,来完成注册,那时年少,只是觉得手机获取验证码这件事儿很好玩,并没有关心太多,她是如何实现的,以及她背后的故事到底是什么样子的,现在小编接手的这个项目里面,就需要通过手机号进行注册,并且手机号发送相应的验证码,来完成注册,那么在一些应用app里面到底是如何实现点击按钮获取验证码,来完成注册这整个流程的呢?今天小编就以注册为例,和小伙伴们分享一下,如何通过手机号获取验证码来完成注册的一整套流程以及如何采用正则表达式来验证手机号码

Android如何通过手机获取验证码来完成注册功能_Android

注册很多app或者网络账户的时候,经常需要手机获取验证码,来完成注册,那时年少,只是觉得手机获取验证码这件事儿很好玩,并没有关心太多,她是如何实现的,以及她背后的故事到底是什么样子的,现在小编接手的这个项目里面,就需要通过手机号进行注册,并且手机号发送相应的验证码,来完成注册,那么在一些应用app里面到底是如何实现点击按钮获取验证码,来完成注册这整个流程的呢?今天小编就以注册为例,和小伙伴们分享一下,如何通过手机号获取验证码来完成注册的一整套流程以及如何采用正则表达式来验证手机号码是否符合电信.

Android如何通过手机获取验证码来完成注册功能

注册很多app或者网络账户的时候,经常需要手机获取验证码,来完成注册,那时年少,只是觉得手机获取验证码这件事儿很好玩,并没有关心太多,她是如何实现的,以及她背后的故事到底是什么样子的,现在小编接手的这个项目里面,就需要通过手机号进行注册,并且手机号发送相应的验证码,来完成注册,那么在一些应用app里面到底是如何实现点击按钮获取验证码,来完成注册这整个流程的呢?今天小编就以注册为例,和小伙伴们分享一下,如何通过手机号获取验证码来完成注册的一整套流程以及如何采用正则表达式来验证手机号码是否符合电信.