简单发送短信倒计时案例

 HTML:

 

  <label for="message">手机号</label>

    <input type="text" id="message">

    <button>发送</button>

 

JS:

    <script>

        var input = document.querySelector('input');

        var btn = document.querySelector('button');

        // 全局变量，定义剩下的秒数

        var lasttime = 3;

        // 注册单击事件

        btn.addEventListener('click', function() {

            // 开启定时器

            var timer = setInterval(function() {

                // 判断剩余秒数

                if (lasttime == 0) {

                    // 清除定时器和复原按钮

                    clearInterval(timer)

                    btn.disabled = false;

                    btn.innerText = '发送';

                    lasttime = 3;

                } else {

                    btn.disabled = true;

                    btn.innerText = '还剩下' + lasttime + '秒';

                    lasttime--;

                }

            }, 1000)

        })

    </script>