js验证码有效时间倒计时

最新推荐文章于 2024-05-02 18:12:22 发布

weixin_30485291

最新推荐文章于 2024-05-02 18:12:22 发布

阅读量444

点赞数

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/wolf12/p/9048840.html

版权

js验证码有效时间倒计时

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title></title>
    <meta charset="utf-8" />
    <script src="Scripts/jquery-1.10.2.min.js"></script>
    <script src="Scripts/jquery.cookie.js"></script>
    <script>

        var max = 60;
        var $btnGetCode;
        var text = "验证码有效秒数：";

        function beginCount() {

            //记下开始计数时间到cookie中，当页面刷新了也可以继续记数
            $.cookie('beginDate', new Date().getTime(), { expires: 60 });

            //设置最大秒数
            max = 60;
            //倒数
            count();
        }

        $(function myfunction() {
            $btnGetCode = $("#btnGetCode");
            //最近点击时间
            var beginDate = parseInt($.cookie('beginDate'));
            //已过秒数
            var currentCount=Math.floor((new Date().getTime() - beginDate) / 1000);
            //剩下秒数
            max = max - currentCount;
            //倒数
            count();
        });

        //递归记数
        function count() { 
        
            if (max > 0 && max <= 60) {
                $btnGetCode.val(text + max--);
                timeoutID = setTimeout("count()", 1000);
            } else if (max==0) {
                $btnGetCode.val("重新获取");
            }
            
        }

    </script>
</head>
<body>
    <input type="button" id="btnGetCode" value="获取验证码" onclick="beginCount()"/>
</body>
</html>

转载于:https://www.cnblogs.com/wolf12/p/9048840.html

weixin_30485291

关注

0
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
js验证码有效时间倒计时

js验证码有效时间倒计时<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title></title> <meta charset="utf-8" /&g...
复制链接

扫一扫