点击按钮，实现60秒倒计时效果（发送手机验证码）

最新推荐文章于 2024-08-09 10:26:02 发布

原创最新推荐文章于 2024-08-09 10:26:02 发布 · 1.5k 阅读

2 ·

本内容遵循CC 4.0 BY-SA版权协议

收录于

jquery

当前文章被收录于：

jquery

30 篇文章 0 人学习

订阅专栏查看详情

当前文章被以下社区和专栏收录：

本文介绍了一种实现按钮60秒倒计时的方法，同时在倒计时期间按钮变为不可点击状态，并更改了按钮上的文字显示。通过设置定时器来递减倒计时并最终恢复按钮状态。

点击按钮实现60秒倒计时，并且实现按钮不可点击，60秒之后才可点击，以及按钮的文字改变

// 60秒倒计时
var countdown = 60;
var timer;

function settime(val) {
timer = setInterval(function() {
$(“#sendCode”).attr(‘disabled’, true);$ (“#sendCode”).addClass(‘activeColor’);
console.log(countdown)
countdown–;

    $("#sendCode").html("重新发送(" + countdown + ")");
    if (countdown == 0) {
        clearInterval(timer);
        $("#sendCode").attr('disabled', false);
        $("#sendCode").removeClass('activeColor');
        $("#sendCode").html("免费获取验证码");
        countdown = 60;
    }
}, 1000)

}