js倒计时（只为记录，不喜勿喷）

最新推荐文章于 2022-11-30 13:47:36 发布

原创最新推荐文章于 2022-11-30 13:47:36 发布 · 187 阅读

0 ·

CC 4.0 BY-SA版权

前端专栏收录该内容

4 篇文章

订阅专栏

这段代码实现了点击“获取验证码”按钮的功能。当输入图形验证码后，按钮开始计时，60秒内不可用，时间递减；计时结束后可重新获取。若未输入图形验证码，则给出提示。主要运用了JavaScript进行交互逻辑处理。

//点击“获取验证码”
$(".code-btn").click(function () {
var imgCode = $(".img-code-input").val(),
tips2 = $(".tips2");
if(imgCode && imgCode!=""){
tips2.removeClass("active");//提示内容隐藏
var second = 60,//初始化时间
btnText = "获取验证码",//按钮文本内容
time="";
//计时调用的函数每隔1s second-1
function timeGo(){
if(second>1){
//判断second>1 递减
second--;
btnText = second+"s后重新获取";
$(".code-btn").attr("disabled","true");//将按钮设置为不可用
}else if(second==1){
btnText = "获取验证码";
clearInterval(time);
$(".code-btn").removeAttr("disabled");//移除disabled属性
}
$(".code-btn").text(btnText);//按钮文本
};
time=setInterval(timeGo,1000)
}else{
tips2.addClass("active");
tips2.text("请输入图形验证码！");
}

});