轉載---javascript 定時器總結

来源:http://www.cnblogs.com/yaohuimo/archive/2016/11/20/6082005.html
-Advertisement-
Play Games

轉載:http://www.jb51.net/article/40193.htm JS里設定延時: 使用SetInterval和設定延時函數setTimeout 很類似。setTimeout 運用在延遲一段時間,再進行某項操作。 setTimeout("function",time) 設置一個超時對 ...


轉載:http://www.jb51.net/article/40193.htm

JS里設定延時: 
使用SetInterval和設定延時函數setTimeout 很類似。setTimeout 運用在延遲一段時間,再進行某項操作。 
setTimeout("function",time) 設置一個超時對象 
setInterval("function",time) 設置一個超時對象 
SetInterval為自動重覆,setTimeout不會重覆。 
clearTimeout(對象) 清除已設置的setTimeout對象 
clearInterval(對象) 清除已設置的setInterval對象 
使用定時器實現JavaScript的延期執行或重覆執行 
window對象提供了兩個方法來實現定時器的效果,分別是window.setTimeout()和window.setInterval。其中前者可以使一段代碼在指定時間後運行;而後者則可以使一段代碼每過指定時間就運行一次。它們的原型如下: 
window.setTimeout(expression,milliseconds); 
window.setInterval(expression,milliseconds); 
其中,expression可以是用引號括起來的一段代碼,也可以是一個函數名,到了指定的時間,系統便會自動調用該函數,當使用函數名作為調用句柄時, 不能帶有任何參數;而使用字元串時,則可以在其中寫入要傳遞的參數。兩個方法的第二個參數是milliseconds,表示延時或者重覆執行的毫秒數。下 面分別介紹兩種方法。 

1.window.setTimeout方法 
該方法可以延時執行一個函數,例如: 

<script language="JavaScript" type="text/javascript"> 
<!-- 
function hello(){ 
alert("hello"); 

window.setTimeout(hello,5000); 
//--> 
</script> 

這段代碼將使得頁面打開5秒鐘後顯示對話框“hello”。其中最後一句也可以寫為:window.setTimeout("hello()",5000); 

者可以體會它們的差別,在window.setInterval方法中也有這樣的性質。 
如果在延時期限到達之前取消延執行,可以使用window.clearTimeout(timeoutId)方法,該方法接收一個id,表示一個定時器。這個id是由setTimeout方法返回的,例如: 

<script language="JavaScript" type="text/javascript"> 
<!-- 
function hello(){ 
      alert("hello"); 

var id=window.setTimeout(hello,5000); 
document.onclick=function(){ 
     window.clearTimeout(id); 

//--> 
</script>

這樣,如果要取消顯示,只需單擊頁面任何一部分,就執行了window.clearTimeout方法,使得超時操作被取消。 

 

2.window.setInterval方法 
該方法使得一個函數每隔固定時間被調用一次,是一個很常用的方法。如果想要取消定時執行,和clearTimeout方法類似,可以調用 window.clearInterval方法。clearInterval方法同樣接收一個setInterval方法返回的值作為參數。例如:

//定義一個反覆執行的調用 
var id=window.setInterval("somefunction",10000); 
//取消定時執行 
window.clearInterval(id); 

上面的代碼僅用於說明怎樣取消一個定時執行。實際上在很多場合都需要用到setInterval方法,下麵將設計一個秒錶,來介紹setInterval 函數的用途:該秒錶將包括兩個按鈕和一個用於顯示時間的文本框。當單擊開始按鈕時開始計時,最小單位為0.01秒,此時再次單擊按鈕則停止計時,文本框顯 示經過的時間。另外一個按鈕用於將當前時間清零。其實現代碼如下:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> 
<html> 
<head> 
<title> New Document </title> 
</head> 
<body> 
<form action="somepage.asp"> 
<input type="text" value="0" name="txt1"/> 
<input type="button" value="開始" name="btnStart"/> 
<input type="button" value="重置" name="btnReset"/> 
</form> 
</body> 
</html> 
<script language="JavaScript" type="text/javascript"> 
<!-- 
//獲取表單中的表單域 
var txt=document.forms[0].elements["txt1"]; 
var btnStart=document.forms[0].elements["btnStart"]; 
var btnReset=document.forms[0].elements["btnReset"] 
//定義定時器的id 
var id; 
//每10毫秒該值增加1 
var seed=0; 
btnStart.onclick=function(){ 
      //根據按鈕文本來判斷當前操作 
      if(this.value=="開始"){ 
              //使按鈕文本變為停止 
              this.value="停止"; 
              //使重置按鈕不可用 
              btnReset.disabled=true; 
              //設置定時器,每0.01s跳一次 
              id=window.setInterval(tip,10); 
      }else{ 
              //使按鈕文本變為開始 
              this.value="開始"; 
              //使重置按鈕可用 
              btnReset.disabled=false; 
              //取消定時 
              window.clearInterval(id); 
      } 

//重置按鈕 
btnReset.onclick=function(){ 
     seed=0; 

//讓秒錶跳一格 
function tip(){ 
      seed++; 
      txt.value=seed/100; 

//--> 
</script>

7.4.3 給定時器調用傳遞參數 
無論是window.setTimeout還是window.setInterval,在使用函數名作為調用句柄時都不能帶參數,而在許多場合必須要帶參數,這就需要想方法解決。例如對於函數hello(_name),它用於針對用戶名顯示歡迎信息: 

var userName="jack"; 
//根據用戶名顯示歡迎信息 
function hello(_name){ 
      alert("hello,"+_name); 

這時,如果企圖使用以下語句來使hello函數延遲3秒執行是不可行的:window.setTimeout(hello(userName),3000); 

這將使hello函數立即執行,並將返回值作為調用句柄傳遞給setTimeout函數,其結果並不是程式需要的。而使用字元串形式可以達到想要的結果: 

window.setTimeout("hello(userName)",3000); 

這裡的字元串是一段JavaScript代碼,其中的userName表示的是變數。但這種寫法不夠直觀,而且有些場合必須使用函數名,下麵用一個小技巧來實現帶參數函數的調用:

<script language="JavaScript" type="text/javascript"> 
<!-- 
var userName="jack"; 
//根據用戶名顯示歡迎信息 
function hello(_name){ 
       alert("hello,"+_name); 

//創建一個函數,用於返回一個無參數函數 
function _hello(_name){ 
       return function(){ 
             hello(_name); 
       } 

window.setTimeout(_hello(userName),3000); 
//--> 
</script> 

這裡定義了一個函數_hello,用於接收一個參數,並返回一個不帶參數的函數,在這個函數內部使用了外部函數的參數,從而對其調用,不需要使用參數。在 window.setTimeout函數中,使用_hello(userName)來返回一個不帶參數的函數句柄,從而實現了參數傳遞的功能。 
window對象有兩個主要的定時方法,分別是setTimeout 和 setInteval 他們的語法基本上相同,但是完成的功能取有區別。 
  setTimeout方法是定時程式,也就是在什麼時間以後乾什麼。幹完了就拉倒。 
  setInterval方法則是表示間隔一定時間反覆執行某操作。 
  JS里設定延時: 
使用SetInterval和設定延時函數setTimeout 很類似。setTimeout 運用在延遲一段時間,再進行某項操作。 
setTimeout("function",time) 設置一個超時對象 
setInterval("function",time) 設置一個超時對象 
SetInterval為自動重覆,setTimeout不會重覆。 
clearTimeout(對象) 清除已設置的setTimeout對象 
clearInterval(對象) 清除已設置的setInterval對象 
        如果用setTimeout實現setInerval的功能,就需要在執行的程式中再定時調用自己才行。如果要清除計數器需要根據使用的方法不同,調用不同的清除方法: 
例如:

tttt=setTimeout('northsnow()',1000); 
clearTimeout(tttt); 

 

tttt=setInterval('northsnow()',1000); 
clearInteval(tttt); 

 


您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • 一、前言 現在越來越多的公司用git進行版本控制,不過git是預設是開源的,如果私有的話是需要付費的,如果不想付費自己可以搭建一個git伺服器用來版本控制。 二、伺服器端操作 1、安裝git 2、創建一個git用戶 3、創建登錄證書 在git用戶目錄下創建.ssh文件夾併在其下創建文件authori ...
  • 1. ASCII碼 1> ASCII碼不包括我們輸入法中的"特殊字元"和"數學字元"等,他們都屬於擴展ASCII 字元 2. GBK編碼 GBK實際上是ASCII的中文擴展編碼,其規則是: 1> 如果第一個位元組的大於127(0x7F, 0111 1111,即最高位為0),則表示從這個位元組開始的2個字... ...
  • 現在大家常用的桌面操作系統有:Windows、Mac OS、ubuntu,其中Mac OS 和 ubuntu上都會自帶python。這裡我們只介紹下Windows(我用的Win10)環境下的python2.x 和 python3.x 的安裝,以及python2.x 與 python3.x 共存時的配 ...
  • seL4之hello 2旅途 2016/11/19 13:15:38 回顧上周 seL4運行環境搭建. 完成 的運行. 補充上周 1.微內核與巨集內核有什麼不同? 微內核——用戶態提供OS服務,一般採用server client架構。代表:L4系列微內核 巨集內核——內核態提供OS服務,通過syscal ...
  • Hi,大家好!我是CrazyCatJack,你們可以叫我CCJ或者瘋貓。今天我給大家帶來的是u-boot的源代碼彙編段分析,以後還會給大家講解後續的C代碼,請持續關註哦^_^ 先簡單說一下u-boot,在嵌入式開發中,u-boot起著至關重要的作用:讀出嵌入式系統內核並啟動內核。因此非常有必要對u- ...
  • 本人菜鳥一枚,大學里憑興趣學了一點WP的皮毛,後來又幸運(或者不幸)的進了一家專註於Windows生態的公司做了一段時間的UWP。在博客園寫點自己遇到的東西,作為分享,也作為自己的備忘,如果有錯誤的地方,或者可以提升B格的地方,希望園子里的大神們不吝賜教。 初進公司時,公司要做支付相關的業務,需要和 ...
  • #! usr/bin/env python#!-*-conding:utf-8-*-#第一步:定義變數 name = 'python' passwd = 'password'#第二步:寫while迴圈 定義count=0#第三步:判斷count=3則列印print("Account Be Locke ...
  • 分散式系統關鍵點 分散式系統(distributed system)是建立在網路之上的軟體系統。正是因為軟體的特性,所以分散式系統具有高度的內聚性和透明性。因此,網路和分散式系統之間的區別更多的在於高層軟體(特別是操作系統),而不是硬體。內聚性是指每一個資料庫分佈節點高度自治,有本地的資料庫管理系統 ...
一周排行
    -Advertisement-
    Play Games
  • 示例項目結構 在 Visual Studio 中創建一個 WinForms 應用程式後,項目結構如下所示: MyWinFormsApp/ │ ├───Properties/ │ └───Settings.settings │ ├───bin/ │ ├───Debug/ │ └───Release/ ...
  • [STAThread] 特性用於需要與 COM 組件交互的應用程式,尤其是依賴單線程模型(如 Windows Forms 應用程式)的組件。在 STA 模式下,線程擁有自己的消息迴圈,這對於處理用戶界面和某些 COM 組件是必要的。 [STAThread] static void Main(stri ...
  • 在WinForm中使用全局異常捕獲處理 在WinForm應用程式中,全局異常捕獲是確保程式穩定性的關鍵。通過在Program類的Main方法中設置全局異常處理,可以有效地捕獲並處理未預見的異常,從而避免程式崩潰。 註冊全局異常事件 [STAThread] static void Main() { / ...
  • 前言 給大家推薦一款開源的 Winform 控制項庫,可以幫助我們開發更加美觀、漂亮的 WinForm 界面。 項目介紹 SunnyUI.NET 是一個基於 .NET Framework 4.0+、.NET 6、.NET 7 和 .NET 8 的 WinForm 開源控制項庫,同時也提供了工具類庫、擴展 ...
  • 說明 該文章是屬於OverallAuth2.0系列文章,每周更新一篇該系列文章(從0到1完成系統開發)。 該系統文章,我會儘量說的非常詳細,做到不管新手、老手都能看懂。 說明:OverallAuth2.0 是一個簡單、易懂、功能強大的許可權+可視化流程管理系統。 有興趣的朋友,請關註我吧(*^▽^*) ...
  • 一、下載安裝 1.下載git 必須先下載並安裝git,再TortoiseGit下載安裝 git安裝參考教程:https://blog.csdn.net/mukes/article/details/115693833 2.TortoiseGit下載與安裝 TortoiseGit,Git客戶端,32/6 ...
  • 前言 在項目開發過程中,理解數據結構和演算法如同掌握蓋房子的秘訣。演算法不僅能幫助我們編寫高效、優質的代碼,還能解決項目中遇到的各種難題。 給大家推薦一個支持C#的開源免費、新手友好的數據結構與演算法入門教程:Hello演算法。 項目介紹 《Hello Algo》是一本開源免費、新手友好的數據結構與演算法入門 ...
  • 1.生成單個Proto.bat內容 @rem Copyright 2016, Google Inc. @rem All rights reserved. @rem @rem Redistribution and use in source and binary forms, with or with ...
  • 一:背景 1. 講故事 前段時間有位朋友找到我,說他的窗體程式在客戶這邊出現了卡死,讓我幫忙看下怎麼回事?dump也生成了,既然有dump了那就上 windbg 分析吧。 二:WinDbg 分析 1. 為什麼會卡死 窗體程式的卡死,入口門檻很低,後續往下分析就不一定了,不管怎麼說先用 !clrsta ...
  • 前言 人工智慧時代,人臉識別技術已成為安全驗證、身份識別和用戶交互的關鍵工具。 給大家推薦一款.NET 開源提供了強大的人臉識別 API,工具不僅易於集成,還具備高效處理能力。 本文將介紹一款如何利用這些API,為我們的項目添加智能識別的亮點。 項目介紹 GitHub 上擁有 1.2k 星標的 C# ...