www.qjdy.com-奇迹赌场 > www.qjdy.com官网 > 而后者则可以使一段代码每过指定时间就运行一

原标题:而后者则可以使一段代码每过指定时间就运行一

浏览次数:177 时间:2019-07-15

在javascritp中,有多个关于反应计时器的专项使用函数,它们是: 

1.倒计测量时间的装置:timename=setTimeout("function();",delaytime); 
2.循环放大计时器:timename=setInterval("function();",delaytime); 

1、机械漏刻概述

window对象提供了八个措施来落到实处停车计时器的成效,分别是window.setTimeout()和window.setInterval。当中前面二个能够使一段代码在指定时期后运维;而后人则能够使一段代码每过指定期期就运维一次。它们的原型如下:

window.setTimeout(expression,milliseconds); 
window.setInterval(expression,milliseconds); 

内部,expression能够是用引号括起来的一段代码,也可以是一个函数名,到了点名的小时,系统便会活动调用该函数,当使用函数名作为调用句柄时, 不能够带有其余参数;而使用字符串时,则足以在里头写入要传送的参数。四个章程的第1个参数是milliseconds,表示延时也许再度实施的飞秒数。上边分别介绍二种方法。

采取SetInterval和设定延时函数setTimeout 很类似。setTimeout 运用在延迟一段时间,再开始展览某项操作。

setTimeout("function",time) 设置八个过期对象
setInterval("function",time) 设置三个过期对象
setInterval为全自动重新,setTimeout不会再一次。

clearTimeout(对象) 清除已安装的setTimeout对象
clearInterval(对象) 清除已设置的setInterval对象
行使放大计时器达成JavaScript的延期实施或重复实践 .

2、具体应用

1.window.setTimeout方法

该措施能够延时实践二个函数,比如:

function hello(){ 
  alert("hello"); 
} 
window.setTimeout(hello,5000); 

这段代码将使得页面展开5分钟后显得对话框“hello”。在那之中最终一句也足以写为:

window.setTimeout("hello()",5000); 

读者能够回味它们的差距,在window.setInterval方法中也可以有诸有此类的属性。

设若在延时定时达到在此之前撤消延试行,能够应用window.clearTimeout(timeoutId)方法,该办法接收一个id,表示多少个沙漏。这么些id是由setTimeout方法重临的,举个例子:

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

如此,若是要注销展现,只需单击页面任何一片段,就实践了window.clearTimeout方法,使得超时操作被打消。

2.window.setInterval方法

该方法使得一个函数每隔固定时期被调用贰遍,是三个很常用的主意。假诺想要打消定期推行,和clearTimeout方法类似,能够调用 window.clearInterval方法。clearInterval方法同样收取贰个setInterval方法重回的值作为参数。比如:

//定义一个反复执行的调用 
var id=window.setInterval("somefunction",10000); 
//取消定时执行 
window.clearInterval(id); 

3. Demo小练习

地点的代码仅用于评释什么撤销三个定期实施。实际上在大多场所都亟需用到setInterval方法,上面将统一盘算四个秒表,来介绍setInterval 函数的用途:该秒表将席卷多少个按键和七个用以体现时间的文本框。当单击开头按键时初叶计时,最小单位为0.01秒,此时再一次单击开关则结束计时,文本框显示经过的小时。其他三个按键用于将近年来光阴清零。其落实代码如下:

<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> 

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表示的是变量。但这种写法远远不足直观,并且有个别场所必须选择函数名,上边用贰个小才能来完结带参数函数的调用:

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)来回到三个不带参数的函数句柄,进而达成了参数字传送递的意义。

4. 准确认知计时器的“按时”效用

第一看一段代码

function display(){
  alert(hello);
}
setTimeout("display()", 3000);
alert("你首先看到的是我!")

代码先输出哪个?答案在先后中很明朗。为啥吗?

初学者大概对Javascript的电火花计时器有误解,感觉它们是线程,其实Javascript是运行于单线程中的,而机械漏刻仅仅是布置在今后的某部时刻施行,而具体的进行时间是不能够保障的,因为在页面的生命周期中,分歧的年月恐怕有任何代码在调节Javascript的里经过。浏览器只是担任举行排序,指派有些代码在某些时间点运营。

上边说下Javascript线程,下图表示javascript进度时间线。

图片 1

而外javascript实施进程外,还大概有三个索要在进程下三次空闲时间实行的代码队列,随着页面在其生命周期内的延迟,代码会依照实施顺序增加到对列中,例如:当四个按键被按下时,它的事件管理就能够加多到队列中,并在下二个恐怕的日子内举办。

停车计时器对队列的做事办法是,当特定的时间过去后,将代码插入,注意增添到队列并不表示它会马上执行,而只好说它会神速试行,设定二个250ms后施行的沙漏,不意味着250ms后它会马上推行,它只会表示在250ms后被投入到行列中,如若那一个时刻点队列是悠闲的,那么这段代码就能够被施行。

请看之下代码:

var btn = document.getElementById("mybtn");
  btn.onclick = function () {
    setTimeout(function () {
      document.getElementById("message").nodeName = "mymessage";
      //其它代码
    }, 250);
  }

对此停车计时器最要注意的是:钦点的时日距离表示曾几何时将计时器的代码增添到行列中,实际不是何时实施代码。关于这些onclick事伯管理的历程时间线请看下图:

图片 2

您恐怕感兴趣的文章:

  • Javascript 坚持计时器调用传递参数的方法
  • Javascript/Jquery——轻便机械漏刻的有余完结格局
  • JavaScript电磁关照计时器详解及实例
  • javascript间隔停车计时器(延时计时器)学习 间隔调用和延时调用
  • 浅析javascript 定时器
  • 深深索求javascript电磁照看计时器
  • JavaScript学习笔记之电磁照看计时器
  • javascript反应计时器完整实例
  • Javascript中setTimeOut和setInterval的计时器用法
  • JavaScript沙漏和优化的吊销放大计时器方法
  • javascript中SetInterval与setTimeout的放大计时器用法
  • 跟作者学习javascript的放大计时器

本文由www.qjdy.com-奇迹赌场发布于www.qjdy.com官网,转载请注明出处:而后者则可以使一段代码每过指定时间就运行一

关键词: CMD体育

上一篇:通过为表单配置class进行统一验证

下一篇:没有了