`

setTimeout,clearTimeout与setInterval,clearInterval

阅读更多
一 参考链接
1 setTimeout与setInterval在不同浏览器下的差异研究
  http://www.iteye.com/topic/578308
2 clearInterval类似JS的clearTimeout
  http://hi.baidu.com/xuaner%C0%B6/blog/item/3f794022d847c0549922edf1.html
3 setTimeout和setInterval
  http://www.iteye.com/topic/221099
4 JS延迟加载 setTimeout方法释疑
  http://www.iteye.com/topic/150712
二 相关解释:
参考W3C文档:
JavaScript 计时事件
通过使用 JavaScript,我们有能力作到在一个设定的时间间隔之后来执行代码,而不是在函数被调用后立即执行。我们称之为计时事件。
在 JavaScritp 中使用计时事件是很容易的,两个关键方法是:
setTimeout()
未来的某时执行代码
clearTimeout()
取消setTimeout()

setTimeout()
var t=setTimeout("javascript语句",毫秒)setTimeout() 方法会返回某个值。在上面的语句中,值被储存在名为 t 的变量中。假如你希望取消这个 setTimeout(),你可以使用这个变量名来指定它。
setTimeout() 的第一个参数是含有 JavaScript 语句的字符串。这个语句可能诸如 "alert('5 seconds!')",或者对函数的调用,诸如 alertMsg()"。
第二个参数指示从当前起多少毫秒后执行第一个参数。
提示:1000 毫秒等于一秒。

语法
setTimeout(code,millisec)参数 描述
code 必需。要调用的函数后要执行的 JavaScript 代码串。
millisec 必需。在执行代码前需等待的毫秒数。

clearTimeout()
clearTimeout() 方法可取消由 setTimeout() 方法设置的 timeout。
语法
clearTimeout(id_of_settimeout)参数 描述
id_of_setinterval 由 setTimeout() 返回的 ID 值。该值标识要取消的延迟执行代码块

<script type="text/javascript">
var c=0
var t

function timedCount()
 {
 document.getElementById('txt').value=c
 c=c+1
 t=setTimeout("timedCount()",1000)
 }

function stopCount()
 {
 clearTimeout(t)
 }
</script>


setInterval

setInterval() 方法可按照指定的周期(以毫秒计)来调用函数或计算表达式。
setInterval() 方法会不停地调用函数,直到 clearInterval() 被调用或窗口被关闭。由 setInterval() 返回的 ID 值可用作 clearInterval() 方法的参数。
语法
setInterval(code,millisec[,"lang"])参数 描述
code 必需。要调用的函数或要执行的代码串。
millisec 必须。周期性执行或调用 code 之间的时间间隔,以毫秒计。
返回值
一个可以传递给 Window.clearInterval() 从而取消对 code 的周期性执行的值。

clearInterval
clearInterval() 方法可取消由 setInterval() 设置的 timeout。
clearInterval() 方法的参数必须是由 setInterval() 返回的 ID 值。
语法
clearInterval(id_of_setinterval)参数 描述
id_of_setinterval 由 setInterval() 返回的 ID 值。
实例
下面这个例子将每隔 50 毫秒调用 clock() 函数。您也可以使用一个按钮来停止这个 clock:
<html>
<body>
<input type="text" id="clock" size="35" />
<script language=javascript>
var int=self.setInterval("clock()",50)
function clock()
  {
  var t=new Date()
  document.getElementById("clock").value=t
  }
</script>
</form>
<button onclick="int=window.clearInterval(int)">
Stop interval</button>

</body>
</html>






分享到:
评论

相关推荐

    Javascript定时器(二)——setTimeout与setInterval

    此外,如果定时器触发的代码没有被正确管理,可能会导致内存泄漏,因此在不再需要时应通过`clearTimeout`或`clearInterval`来清除定时器。 `setTimeout`和`setInterval`之间的一个显著区别是执行次数。`setTimeout`...

    Javascript中, setTimeout() 和 setInterval() 的方法

    例如,对于`setTimeout()`,可以使用`clearTimeout()`,而对于`setInterval()`,则使用`clearInterval()`。 在实际开发中,`setTimeout()`常用于实现一次性延迟执行,如加载动画的结束;而`setInterval()`则适用于...

    JS中的setTimeout和setInterval的区别JS中的setTimeout和setInterval的区别

    ### JS中的setTimeout与setInterval的区别 在JavaScript编程中,`setTimeout`与`setInterval`是两个非常常用的函数,用于控制代码执行的时间间隔。虽然它们在功能上有一定的相似性,但其实现的效果却大不相同。下面...

    深化理解setTimeout函数和setInterval函数_.docx

    与`setTimeout`不同,`setInterval`会一直重复执行,直到调用`clearInterval`来停止。例如: ```javascript var intervalId = setInterval(myFunction, 1000); function myFunction() { console.log('Hello'); ...

    setTimeout和setInterval的区别

    `setTimeout`返回一个唯一ID,这个ID可以用于取消已经设置的定时器,通过调用`clearTimeout`函数,例如`clearTimeout(对象)`。 而`setInterval`则不同,它会每隔`DelayTime`就执行一次`Expression`,直到被明确地...

    VUE中setTimeout和setInterval自动销毁案例

    同样的方法可以应用于`setInterval`,只需替换`clearTimeout`为`clearInterval`。 此外,对于异步请求,比如Ajax,我们也可以采用类似的方法,存储请求的句柄并在页面切换时调用`abort()`来取消请求,防止服务器...

    理解javascript定时器中的setTimeout与setInterval

    与`setTimeout`一样,`setInterval`在标准浏览器和IE10以上版本也支持传递额外参数。 然而,`setTimeout`和`setInterval`在处理`this`关键字时有一个常见问题。由于它们执行的代码是在全局作用域中,因此`this`通常...

    js中SetInterval与setTimeout用法

    JS 中 SetInterval 与 setTimeout 用法 在 JavaScript 中,SetInterval 和 setTimeout 是两种常用的定时器函数,用于实现延迟执行或重复执行某些操作。下面我们将详细讲解这两种函数的区别和用法。 SetTimeout ...

    深入理解setTimeout函数和setInterval函数

    其语法与`setTimeout`相似: ```javascript setInterval(code, millisec[, "lang"]); ``` - `code`(必需):要调用的函数或要执行的代码字符串。 - `millisec`(必需):每次执行代码之间的间隔,以毫秒计。 - `...

    js中setTimeout()与clearTimeout()用法实例浅析.docx

    JavaScript中的`setTimeout()`和`clearTimeout()`是两个非常重要的函数,它们主要用于实现异步编程中的定时操作。在JavaScript中,由于其单线程执行的特性,`setTimeout()`和`clearTimeout()`提供了延迟执行代码和...

    javascript setTimeout和setInterval计时的区别详解

    setInterval函数同样允许你设定一个时间间隔,但与setTimeout不同,setInterval设定的函数会每隔`delay`毫秒重复执行。 其基本语法为: ``` var intervalID = setInterval(func, delay[, param1, param2, ...]); ``...

    JavaScript setTimeout和setInterval的使用方法 说明

    与setTimeout不同的是,setInterval会在第一次执行后每隔给定的时间间隔重复执行代码。 #### 示例 ```javascript function showTime() { var today = new Date(); alert("The time is: " + today.toString()); } ...

    javascript setTimeout和setInterval 的区别

    与`setTimeout`不同,`setInterval`会一直重复执行,直到被明确地取消。 ```javascript var timer2 = setInterval('startShow()', 2000); ``` 以上代码会每2秒钟执行一次`startShow()`函数,直到`clearInterval`...

    js中SetInterval与setTimeout用法.pdf

    JavaScript 中的 SetInterval 与 setTimeout 用法 在 JavaScript 中,SetInterval 和 setTimeout 是两种常用的定时器函数,用于实现延迟执行或重复执行某些操作。本文将详细介绍这两种函数的用法和区别。 ...

    解决vue 使用setTimeout,离开当前路由setTimeout未销毁的问题

    在实际的项目中,如果要在组件销毁之前手动清除定时器,可以在Vue组件的beforeDestroy钩子中使用clearTimeout或clearInterval。为了避免在组件销毁后定时器还继续运行,应该在组件的destroyed钩子中也清除定时器。...

    js代码-settimeout 模拟实现 setinterval(带清除定时器的版本)

    使用这两个自定义函数的方式与原生的`setInterval`和`clearInterval`相同: ```javascript const timerId = mySetInterval(() =&gt; console.log('Hello, world!'), 1000); // ... myClearInterval(timerId); ``` ...

    cpp-timercpp为C开发提供类似于Javascript中的setTimeout和setInterval功能

    - 取消定时任务:如果需要在特定条件下取消已经设置的定时任务,库可能会提供`clearTimeout`和`clearInterval`方法。 - 多个定时器:可能支持同时设置多个定时器,每个定时器都有独立的标识,便于管理和操作。 - ...

    快速掌握Node.js中setTimeout和setInterval的使用方法

    setInterval的参数与setTimeout类似,区别在于setInterval会无限期地每隔指定的时间重复执行回调函数,直到通过clearInterval函数明确停止。 ```javascript clearInterval(intervalId); ``` 示例代码演示了如何使用...

    JS中SetTimeout和SetInterval使用初探

    对于 `setTimeout`,使用 `clearTimeout`,而对于 `setInterval`,使用 `clearInterval`。例如: ```javascript var timer = setTimeout('startShow()', 2000); clearTimeout(timer); timer = setInterval('start...

Global site tag (gtag.js) - Google Analytics