zoukankan      html  css  js  c++  java
  • 提交安钮 提交一次加了 59秒倒计时

    实现点击“发送验证码”按钮后,按钮依次显示为“59秒后重试”、“58秒后重试”…直至倒计时至0秒时再恢复显示为“发送验证码”。在倒计时期间按钮为禁用状态

     PS:  当倒计时开始的时候。 要把 计时器 清了。 不要然会点击, 加快秒数。

    <!doctype html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Document</title>
        <script type="text/javascript">
            window.onload = function () {
                var send = document.getElementById('send'),
                    times = 60,
                    timer = null;
                send.onclick = function () {
                    // 计时开始
                    timer = setInterval(function () {
                        times--;
                        if (times <= 0) {
                            send.value = '发送验证码';
                            clearInterval(timer);
                            send.disabled = false;
                        } else {
                            send.value = times + '秒后重试'
                            send.disabled = true;
                        }
                        console.log(times)
                    }, 1000)
    
                }
            }
        </script>
    </head>
    <body>
    <input type="button" id="send" value="发送验证码">
    </body>
    </html>
  • 相关阅读:
    php CI框架基础知识
    1206 多表单提交,强类型
    1205 Mvc的Razor语法
    1204 Mvc
    1117 邮件验证
    1115 模板页
    1113 Ajax
    1110 Jquary动画
    1108 Jquary
    1107 Linq高级查询
  • 原文地址:https://www.cnblogs.com/yjhua/p/4616682.html
Copyright © 2011-2022 走看看