美文网首页
获取验证码倒计时前端效果

获取验证码倒计时前端效果

作者: 风度翩翩的程序猿 | 来源:发表于2020-11-12 15:06 被阅读0次

    在我们开发过程中,很多登录或者注册,都会有获取手机验证码的功能,但是这个功能要有倒计时,60秒一轮回

    直接上代码吧,很简单的 jq

    function code(obj) {
        obj = obj || $("input[type=button]");
        var num = 60;
        var timer = setInterval(function () {
            if (num > 1) {
                num--;
                obj.val("重新发送(" + num + ")").attr("disabled", "disabled");
                obj.css('background', '#B8B8B8');
            } else {
                obj.val("获取验证码").removeAttr("disabled");
                obj.css('background', '#435E97');
                clearInterval(timer);
            }
        }, 1000)
    };
    

    效果图如下
    ![S]P(VG3@A({25AYI5$E0Y4Y.png](https://img.haomeiwen.com/i19228194/764076233a0409d9.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)

    相关文章

      网友评论

          本文标题:获取验证码倒计时前端效果

          本文链接:https://www.haomeiwen.com/subject/qvlpbktx.html