05.定時器案例

定時器
因爲javascript比較簡單,很多語法和Java基本一致的,所以我們不會很具體詳細的解釋代碼。
需求:有時候,我們在付完款後,頁面會提示幾秒後跳轉到原頁面。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>JavaScript學習</title>
</head>
<script>
    //定義計時器,setInterval()第一個參數是函數,但是嵌套在function(){}
    //是爲了打開頁面就執行,而不需要按鈕之類的去響應
    var time_interval = setInterval(function(){myTime()},1000);
    //跳轉的方法
    myTimeout();
    var t = 5;
    function myTime(){
        document.getElementById("time").innerText = t+"s之後跳轉百度首頁";
        t--;
        if(t<=0){
            //移除計時器,跳轉頁面
            window.clearInterval(time_interval);
        }
    }
    function myTimeout(){
        setTimeout("window.location.href='http://www.baidu.com'",5000);
    }
</script>
<body>
    <div id="time"></div>
</body>
</html>

JavaScript 計時事件
通過使用 JavaScript,我們有能力做到在一個設定的時間間隔之後來執行代碼,而不是在函數被調用後立即執行。我們稱之爲計時事件。

在 JavaScritp 中使用計時事件是很容易的,兩個關鍵方法是:

setInterval()- 間隔指定的毫秒數不停地執行指定的代碼。
setTimeout()- 在指定的毫秒數後執行指定代碼。

注意: setInterval() 和 setTimeout() 是 HTML DOM Window對象的兩個方法。

如何停止執行?
clearInterval()方法用於停止 setInterval() 方法執行的函數代碼。

語法

window.clearInterval(intervalVariable);

window.clearInterval() 方法可以不使用window前綴,直接使用函數clearInterval()。

要使用 clearInterval() 方法, 在創建計時方法時你必須使用全局變量:

var myVar=setInterval(function,milliseconds);
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章