js控制5秒后页面自动跳转

来源:互联网 发布:网络销售模式案例分析 编辑:程序博客网 时间:2024/05/22 16:57

分别用 setTimeout() 和 setInterval() 实现

1.setTimeout()

<!DOCTYPE html><html><body>    <span id="jumpTo">5</span>秒后自动跳转到http://www.baidu.com/    <script>    countDown(5);    function countDown(secs) {        var jumpTo = document.getElementById("jumpTo");        jumpTo.innerHTML = secs;        if (--secs > 0)            setTimeout("countDown(" + secs + ")", 1000);        else            location.href = "http://www.baidu.com/";    }    </script> </body></html>

2.setInterval(),需要clearInterval()函数配合

<!DOCTYPE html><html><body>    <span id="jumpTo">5</span>秒后自动跳转到http://www.baidu.com/    <button id="btnJump" onclick="location = 'http://www.baidu.com'" >立刻跳转</button>    <script>        autoRedirect();        function autoRedirect() {            var casetime = {                init: function () {                    window.zibrtimer = setInterval(this.change, 1000);                },                change: function () {                    var time = document.getElementById("jumpTo").innerHTML;                    time = parseInt(time);                    time--;                    document.getElementById("jumpTo").innerHTML = time;                    if (time == 0) {                        window.clearInterval(window.zibrtimer);                        alert("a");                        location.href = "http://www.baidu.com"                        return;                    }                },            };            casetime.init();        }    </script></body></html>
0 0
原创粉丝点击