验证码倒计时

验证码倒计时,同时防止页面刷新后重置。

<script>
  //倒计时
    function countDown() {
        var second = getCookieValue("SecondNum") ? getCookieValue("SecondNum") : 0;//获取cookie值
        if (second == 0) {
            $("#btn_Second").attr("disabled", false);
            document.getElementById("btn_Second").style.cursor = "pointer";//启用鼠标
            $("#btn_Second").val('获取验证码');
            addCookie("SecondNum", 60, 60); //添加cookie记录,有效时间60s
            return;
        } else {
            $("#btn_Second").attr("disabled", true);
            document.getElementById("btn_Second").style.cursor = "not-allowed";//禁用鼠标
            $("#btn_Second").val(second + "秒后重新发送");
            second--;
            editCookie("SecondNum", second, second + 1);
        }

        setTimeout(function () {
            countDown();
        }, 1000);
    }

    //发送验证码时添加cookie
    function addCookie(name, value, expiresHours) {
        var cookieString = name + "=" + escape(value);
        //判断是否设置过期时间,0代表关闭浏览器时失效
        if (expiresHours > 0) {
            var date = new Date();
            date.setTime(date.getTime() + expiresHours * 1000);
            cookieString = cookieString + ";expires=" + date.toUTCString();
        }
        document.cookie = cookieString;
    }

    //修改cookie的值
    function editCookie(name, value, expiresHours) {
        var cookieString = name + "=" + escape(value);
        if (expiresHours > 0) {
            var date = new Date();
            date.setTime(date.getTime() + expiresHours * 1000); //单位是毫秒
            cookieString = cookieString + ";expires=" + date.toGMTString();
        }
        document.cookie = cookieString;
    }

    //根据名字获取cookie的值
    function getCookieValue(name) {
        var strCookie = document.cookie;
        var arrCookie = strCookie.split("; ");
        for (var i = 0; i < arrCookie.length; i++) {
            var arr = arrCookie[i].split("=");
            if (arr[0] == name) {
                return unescape(arr[1]);
                break;
            }
        }
    }
</script>

 

posted @ 2019-08-23 09:30  芦·笙  阅读(550)  评论(0)    收藏  举报