JS实现页面倒计时自动关闭

最新推荐文章于 2022-02-16 11:26:10 发布

1594231563

最新推荐文章于 2022-02-16 11:26:10 发布

阅读量2.8k

点赞数 1

文章标签： web javascript html

本文链接：https://blog.csdn.net/qq_16186465/article/details/115922151

版权

JS实现页面倒计时自动关闭

没啥好说的直接上代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>支付成功</title>
    <style>
        * {
            margin: 0;
            padding: 0;
        }
        .timeOut {
            margin-top: 150px;
            text-align: center;
            font-size: 13px;
        }
        #timeOutClose {
            margin: 0 2px 0 2px;
            color: red;
            font-size: 14px;
        }
    </style>
</head>
<body>
    <div class="timeOut">
        <span>
            本窗口将在<span id="timeOutClose"></span>秒后自动关闭!
        </span>
    </div>
    <script>
        var timeOut = document.getElementById("timeOutClose");
        var i = 5;
        var timeout = function () {
            timeOut.innerText = i;
            //innerHtml和innerText的区别也可以了解一下
            if (i >= 0){
                setTimeout("timeout();", 1000);//设置定时器
                //好奇为什么不用setIterval()的可以搜一下他们俩的区别
            }
            else {
                window.close();//关闭页面方法
            }
            i--;
        }
        timeout();
    </script>
</body>
</html>