jquery 倒计时发送短信验证码效果

最新推荐文章于 2024-07-20 21:16:51 发布

泥猴桃

最新推荐文章于 2024-07-20 21:16:51 发布

阅读量2.7k

点赞数 1

分类专栏： jquery 文章标签： jquery 验证码短信

本文链接：https://blog.csdn.net/shi851051279/article/details/53041809

版权

jquery 专栏收录该内容

10 篇文章 0 订阅

订阅专栏

话不多说直接上代码

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <script src="js/jquery-1.12.3.min.js"></script>
    <script type="text/javascript">
        $(function () {

            $(".btn").click(function () {
                settime(this)
            });

            var countdown = 60;

            function settime(obj) {
                if (countdown == 0) {
                    obj.removeAttribute("disabled");
                    obj.innerHTML = "获取验证码";
                    countdown = 60;
                    return;
                } else {
                    obj.setAttribute("disabled", true);
                    obj.innerHTML = "" + countdown + "秒后再获取";
                    countdown--;
                }
                setTimeout(function () {
                    settime(obj)
                }, 1000)
            }
        });

    </script>
</head>
<body>

 <button class="btn">点击获取验证码</button>

</body>
</html>