设置网页一定时间后重新发送验证码（60秒）_html中60秒后重新发送验证码-优快云博客

本文链接：https://blog.youkuaiyun.com/qq_30607881/article/details/77369151

本文提供了一段代码示例，详细介绍了如何在网页中设置验证码在60秒后自动重新发送的功能，以增强网站的安全性和用户体验。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

这里废话不多说直接代码提供参考：

var InterValObj; //timer变量，控制时间
var count = 60; //间隔函数，1秒执行
var curCount;//当前剩余秒数
//发送手机验证码
function sendPhoneCode(){
    curCount = count;
    //设置button效果，开始计时
    //$("#btnSendCode").attr("disabled", "true");
    $("#btnSendCode").text(curCount + "秒后重新发送");
    $("#btnSendCode").removeAttr("onclick");
    InterValObj = window.setInterval(SetRemainTime, 1000); //启动计时器，1秒执行一次
    if(checkPhoneNum()){        //检查手机号格式
        $.ajax({
            url:"地址",
            type : 'POST',
            data : {
                "user":JSON.stringify({phone_num:$("#phone_num").val(),}),
            },
            dataType : "json",
            success : function(data) {
                layer.msg(data.msg, {icon:data.type});
            }
        })
    }
}
//timer处理函数
function SetRemainTime() {
      if (curCount == 1) {        
        window.clearInterval(InterValObj);//停止计时器
        //$("#btnSendCode").removeAttr("disabled");//启用按钮
        $("#btnSendCode").attr("onclick","sendPhoneCode();");
        $("#btnSendCode").text("免费获取");
      }
      else {
        curCount--;
        $("#btnSendCode").text(curCount + "秒后重新发送");
      }
    }
//验证手机号是否为空
function checkPhoneNum(){
    var phone_num = $("#phone_num").val();

    if(phone_num==""){
        layer.msg("请输入您的手机号码",{icon:0});
        return false;
    }

    return true;
}