HTML代码

1
<input type="button" class="layui-btn layui-btn-warm" style="margin-top: 12px" value="获取验证码" onclick="setTime(this);">

JavaScript代码

点击获取验证码按钮后，将按钮设置为不可用，60秒时间到了之后将按钮设置为可用

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
<script type="text/javascript">
 
    //倒计时
    var countdown = 60;
 
    function setTime(val) {
        if (countdown == 0) {
            val.removeAttribute("disabled");
            val.className = 'obtain generate_code layui-btn layui-btn-warm';
            val.value = "获取验证码";
            countdown = 60;
            return false;
        } else {
            val.setAttribute("disabled", true);
            val.className = 'obtain generate_code layui-btn layui-btn-warm layui-btn-disabled';
            val.value = "重新发送(" + countdown + ")";
            countdown--;
        }
        setTimeout(function () {
            setTime(val);
        }, 1000);
    }
</script>

结果

img