javascript中interval与setTimeOut的区别示例介绍
更新时间：2014年03月14日 17:09:36 作者：
这篇文章主要介绍了javascript中interval与setTimeOut的区别,需要的朋友可以参考下
setTimeout(code,millisec) //- 在指定时间后执行代码
code必须；
millisec必须；
clearTimeout(setTimeoutId) //- 取消 setTimeout()
setInterval(code,millisec)；//指定间隔毫秒内循环执行代码
code必须；
millisec必须；
clearInterval(intervalId);
用setTimeout(code,millisec)可以实现setInterval效果，只需要嵌套调用方法即可；
下面是一个倒计时页面
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<script type="text/javascript">
var c=6;
var t;
function timedCount()
{
var time = document.getElementById('txt').value;
if( time>0){
document.getElementById('txt').value=c;
c=c-1;
t=setTimeout("timedCount()",1000);
}
else{
clearTimeout(t);
}
}
</script>
</head>
<body>
<form>
<input type="button" value="开始计时！" onClick="timedCount()">
<input type="text" id="txt" value="6">
</form>
</body>
</html>
code必须；
millisec必须；
clearTimeout(setTimeoutId) //- 取消 setTimeout()
setInterval(code,millisec)；//指定间隔毫秒内循环执行代码
code必须；
millisec必须；
clearInterval(intervalId);
用setTimeout(code,millisec)可以实现setInterval效果，只需要嵌套调用方法即可；
下面是一个倒计时页面
复制代码 代码如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<script type="text/javascript">
var c=6;
var t;
function timedCount()
{
var time = document.getElementById('txt').value;
if( time>0){
document.getElementById('txt').value=c;
c=c-1;
t=setTimeout("timedCount()",1000);
}
else{
clearTimeout(t);
}
}
</script>
</head>
<body>
<form>
<input type="button" value="开始计时！" onClick="timedCount()">
<input type="text" id="txt" value="6">
</form>
</body>
</html>
相关文章
Javascript Throttle & Debounce应用介绍
Throttle:无视一定时间内所有的调用Debounce:一定间隔内没有调用时，接下来将为大家介绍下Throttle & Debounce的应用，感兴趣的朋友可以参考下哈2013-03-03
这篇文章主要介绍了如何让es6 写的文件import 起来详解的相关资料,需要的朋友可以参考下2016-12-12
这篇文章主要介绍了javascript处理a标签超链接默认事件的方法,涉及event.preventDefault()方法阻止默认事件的使用技巧,需要的朋友可以参考下2015-06-06
下面小编就为大家分享一篇详谈DOM简介及节点、属性、查找节点的方法，具有非常好的参考价值，一起跟随小编过来看看吧，希望对大家有所帮助2017-11-11
这篇文章主要介绍了在网页上通过JS实现文本的语音朗读，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2019-03-03
我们不论用什么程序，经常会用到的js代码，建议大家收藏好，方便以后使用2008-06-06
本文没有详细描述这些新特性，因为网上都已经有很多相关的介绍了。主要针对ES6 新特性收集了相关范例代码，他可以让你快速了解这个新的javascript规范2017-03-03
javascript中没有块级作用域。取而代之的javascript使用的是函数作用域（function scope）：变量在声明它的函数体以及这个函数体嵌套的任意函数体内都是有定义的。2014-11-11
本篇文章讲述了JS同步、异步、延迟加载的方法，具有很好的参考价值，希望对大家的学习有所帮助2018-05-05
用JS实现一个TreeMenu效果分享，思路比较简单，但很实用2011-08-08
最新评论