JavaScript练习-手机号验证之短信发送

    <script>
        // 输入框
        var input = document.querySelector("input");
        // 大字提示框
        let span = document.querySelector(".title")
            // 判断合法的内容
        let tag = document.querySelector("#tag")
            // 按钮
        let btn = document.querySelector('button')
            // 输入框事件
        input.addEventListener("input", () => {
            if (input.value) {
                span.style.display = 'inline-block'
                span.innerHTML = input.value
                    // 验证正则表达式
                let xxx = /^[1][0-9]{10}$/
                console.log();
                if (xxx.test(input.value)) {
                    tag.innerHTML = "手机号合法";
                    tag.className = "green"
                    btn.disabled = false
                } else {
                    tag.innerHTML = "手机号不合法";
                    tag.className = "red"
                    btn.disabled = true
                }
            } else {
                span.style.display = 'none'
            }
        })

        // 按钮事件
        btn.addEventListener('click', function() {
            this.disabled = true
            let i = 4;
            let tim = setInterval(function() {
                i--;
                btn.innerHTML = "倒计时还剩下" + i + "秒"
                console.log(i);
                if (i === 0) {
                    console.log("结束");
                    btn.innerHTML = "发送短信"
                    this.disabled = false;
                    clearInterval(tim)
                }
            }, 1000)
        })
    </script>```