2021-06-05——发送信息倒计时案例（小白笔记第一天）

最新推荐文章于 2024-10-17 15:53:46 发布

zmh_1998

最新推荐文章于 2024-10-17 15:53:46 发布

阅读量78

点赞数 3

分类专栏：代码小白养成记

本文链接：https://blog.csdn.net/zmh_1998/article/details/117598851

版权

JavaScript 倒计时事件监听 DOM操作定时器

关键词由CSDN通过智能技术生成

代码小白养成记专栏收录该内容

2 篇文章 0 订阅

订阅专栏

发送信息倒计时案例（小白笔记第一天）

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>信息发送案例</title>
</head>

<body>
    <input type="text" placeholder="请发送信息"><button class="but">发送</button>
    <script>
        var but = document.querySelector(".but");
        var time = 5;
        but.addEventListener('click', function() {
            this.disabled = true;

            var timer = setInterval(function() {
                if (time == 0) {
                    clearInterval(timer)
                    but.disabled = false;
                    but.innerHTML = "发送"
                    time = 5;
                } else {
                    but.innerHTML = "还剩" + time + "秒";
                    time--;
                }
            }, 1000);


        })
    </script>

</body>

</html>