這篇文章主要為大家詳細(xì)介紹了JavaScript中使用setTimeout()設(shè)置定時器的方法,圖文詳解容易學(xué)習(xí),配合代碼閱讀理解效果更佳,非常適合初學(xué)者入門,感興趣的小伙伴們可以參考一下。
創(chuàng)新互聯(lián)公司長期為近1000家客戶提供的網(wǎng)站建設(shè)服務(wù),團(tuán)隊從業(yè)經(jīng)驗10年,關(guān)注不同地域、不同群體,并針對不同對象提供差異化的產(chǎn)品和服務(wù);打造開放共贏平臺,與合作伙伴共同營造健康的互聯(lián)網(wǎng)生態(tài)環(huán)境。為盧龍企業(yè)提供專業(yè)的網(wǎng)站制作、成都網(wǎng)站建設(shè),盧龍網(wǎng)站改版等技術(shù)服務(wù)。擁有10年豐富建站經(jīng)驗和眾多成功案例,為您定制開發(fā)。
在JavaScript中,通過給setTimeout()方法設(shè)置需要調(diào)用的函數(shù)或要執(zhí)行的代碼串參數(shù),和延遲的時間參數(shù);在調(diào)用setTimeout()方法就可以設(shè)置一個簡單的定時器。
在JS中,提供了一些原生方法來實現(xiàn)在設(shè)定的時間間隔之后去執(zhí)行某一段代碼;setTimeout()方法設(shè)置的是一次性定時器,是僅在指定的延遲時間之后觸發(fā)一次。下面我們就來看看setTimeout()方法如何設(shè)置定時器。
setTimeout()方法
setTimeout():設(shè)置一次性定時器,在指定的毫秒數(shù)后調(diào)用函數(shù)或計算表達(dá)式;會在載入時延遲指定時間后,去執(zhí)行一次表達(dá)式,僅執(zhí)行一次。【相關(guān)視頻教程推薦:JavaScript教程】
語法:
setInterval(code,millisec,lang);
參數(shù)說明:
code:必需的參數(shù),表示需要調(diào)用的函數(shù)或要執(zhí)行的代碼串。
millisec:必須的參數(shù),表示周期性執(zhí)行或調(diào)用 “code參數(shù)”前的時間間隔,以毫秒為單位計時(1s=1000ms)。
lang 可選的參數(shù)。
setTimeout()方法的示例:
html代碼:
<p>點擊按鈕,在等待 3 秒后彈出 "Hello"。</p> <button onclick="myFunction()">點我</button>
js代碼:
function myFunction() { setTimeout(function(){alert("Hello")},3000); }
效果圖:
setTimeout()設(shè)置無限循環(huán)的定時器
使用setTimeout()方法也可以實現(xiàn)無限循環(huán)的定時器,我們需要編寫一個函數(shù)來調(diào)用其自身。此時setTimeout()方法會無限循環(huán),如果想要停止定時器,就需要使用clearTimeout()方法。
clearTimeout()方法
clearTimeout():用來取消setTimeout()設(shè)置的定時器,在設(shè)置setTimeout()進(jìn)行無限循環(huán)時使用。
語法:
clearTimeout(id_of_setTimeout);
參數(shù)說明:
id_of_setTimeout:表示由 setTimeout() 返回的 ID 值。
注:該值標(biāo)識要取消的延遲調(diào)用的函數(shù)或延遲執(zhí)行的代碼串;
setTimeout()方法和clearTimeout()方法的聯(lián)合示例
<!DOCTYPE HTML> <html> <head> <script type="text/javascript"> var num=0,i; function timedCount(){ document.getElementById('txt').value=num; num=num+1; i=setTimeout(timedCount,1000); } setTimeout(timedCount,1000); function stopCount(){ clearTimeout(i); } </script> </head> <body> <form> <input type="text" id="txt"> <input type="button" value="Stop" onClick="stopCount()"> </form> </body> </html>
效果圖:
可以看出,一開始setTimeout()設(shè)置的定時器在無限循環(huán),使得input框中的數(shù)字在不斷的增大,當(dāng)按下Stop按鈕后,就會調(diào)用clearTimeout()方法,停止setTimeout()定時器,數(shù)字就停止增加,保持為數(shù)字11。
看完上述內(nèi)容,你們掌握使用setTimeout()設(shè)置定時器的方法了嗎?如果還想學(xué)到更多技能或想了解更多相關(guān)內(nèi)容,歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道,感謝各位的閱讀!
名稱欄目:JavaScript之setTimeout()設(shè)置定時器
本文來源:http://www.chinadenli.net/article18/jogsgp.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供網(wǎng)站導(dǎo)航、域名注冊、網(wǎng)站建設(shè)、外貿(mào)網(wǎng)站建設(shè)、ChatGPT、網(wǎng)站內(nèi)鏈
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時需注明來源: 創(chuàng)新互聯(lián)