1.如果想要在执行一个js函数之前延迟一段时间应该怎么做?

答:"setTimeout('update()',1000);"

其中update()函数就是延迟后执行的函数,后面的时间单位为ms。

实例一:

<script language="javascript">
var i;// 第10行代码 setTimeout("abc()",5000);
function abc(){
// 第11行代码以后的全部放在这个函数里
alert(1);
}
</script>

实例二:

<script>
var i=1;
var timeID=null;
function display()
{
timeID = window.setInterval("delay()", 1000);
}
function delay()
{
if(i<10)
{
alert(i);
i++;
}
else
{
window.clearInterval(timeID);
}
}
display();
</script>

如果你能看看源代码,会发现我们的任务很简单,就是给文档增加一个 input 文本框,并聚焦和选中。请现在分别点击一下,可以看到,1 并没有能够聚焦和选中,而 2 可以。它们之间的区别在于,在执行

input.focus();

input.select();

时, 2 多了一个延迟时间为 0 的 setTimeout 的外围函数,即:

setTimeout(function(){

input.focus();

input.select();

}, 0);

按照 JavaScript: The Definitive Guide 5th 的 14.1 所说:

在实践中,setTimeout 会在其完成当前任何延宕事件的事件处理器的执行,以及完成文档当前状态更新后,告诉浏览器去启用 setTimeout 内注册的函数。

其实,这是一个把需要执行的任务从队列中跳脱的技巧。回到前面的例子,JavaScript 引擎在执行 onkeypress 时,由于没有多线程的同步执行,不可能同时去处理刚创建元素的 focus 和 select 事件,由于这两个事件都不在队列中,在完成 onkeypress 后,JavaScript 引擎已经丢弃了这两个事件,正如你看到的例子 1 的情况。而在例子 2 中,由于setTimeout可以把任务从某个队列中跳脱成为新队列,因而能够得到期望的结果。

这 才是延迟事件为 0 的setTimeout的真正目的。在此,你可以看看例子 3,它的任务是实时更新输入的文本,现在请试试,你会发现预览区域总是落后一拍,比如你输 a, 预览区并没有出现 a, 在紧接输入 b 时, a 才不慌不忙地出现。其实我们是有办法让预览区跟输入框同步地,在此我没有给出答案,因为上面所说的,就是解决思路

js设定延迟时间的函数的更多相关文章

  1. underscore.js中的节流函数debounce及trottle

    函数节流   throttle and debounce的相关总结及想法 一开始函数节流的使用场景是:放止一个按钮多次点击多次触发一个功能函数,所以做了一个clearTimeout setTimeou ...

  2. 【Mocha.js 101】钩子函数

    前情提要 在上一篇文章<[Mocha.js 101]同步.异步与 Promise>中,我们学会了如何对同步方法.异步回调方法以及 Promise 进行测试. 在本篇文章中,我们将了解到 M ...

  3. JS魔法堂:函数重载 之 获取变量的数据类型

    Brief 有时我们需要根据入参的数据类型来决定调用哪个函数实现,就是说所谓的函数重载(function overloading).因为JS没有内置函数重载的特性,正好给机会我们思考和实现一套这样的机 ...

  4. js中的回调函数的理解和使用方法

    js中的回调函数的理解和使用方法 一. 回调函数的作用 js代码会至上而下一条线执行下去,但是有时候我们需要等到一个操作结束之后再进行下一个操作,这时候就需要用到回调函数. 二. 回调函数的解释 因为 ...

  5. js两种定义函数、继承方式及区别

    一:js两种定义函数的方式及区别 1:函数声明: function sayA() { alert("i am A"); } 2:函数表达式: var sayB = function ...

  6. WebView中Js与Android本地函数的相互调用

    介绍 随着Html5的普及,html在表现力上不一定比原生应用差,并且有很强的扩展兼容性,所以越来越多的应用是采用Html与Android原生混合开发模式实现. 既然要实现混合开发,那么Js与Andr ...

  7. ASP.NET前台JS与后台CS函数如何互相调用

    摘要: 在实际的Web开发中,我们可能会常常遇到后台调用前台JS代码或者前台JS调用后台代码的情况.今天就把比较实用的前后台相互调用的方法总结出来和大家分享. 在实际的Web开发中,我们可能会常常遇到 ...

  8. JS封装cookie操作函数实例(设置、读取、删除)

    本文实例讲述了JS封装cookie操作函数.分享给大家供大家参考,具体如下: ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 ...

  9. js调用父框架函数

    if (window.parent && window.parent.frames["frame_main"]) { alert(window.parent.fra ...

随机推荐

  1. Delphi之Exception获得错误信息(简单好理解)

    Delphi之Exception获得错误信息 相关资料: http://www.cnblogs.com/hackpig/archive/2010/02/15/1668547.html 实例代码: 1 ...

  2. jquery添加刪除

    創建元素的方法:jquery.javascript/dom,html/text var txt1="<p>Text.</p>";               ...

  3. js條件結構和循環結構

    條件結構: if(語句1) if(語句1)else(語句2) if(語句1)elseif(語句2)else(語句3) switch結構: switch() { case 1: break: case ...

  4. Django的datetime.timedelta类(Django编程-2)

    datetime.timedelta对象代表两个时间之间的时间差,两个date或datetime对象相减就可以返回一个timedelta对象. 如果有人问你昨天是几号,这个很容易就回答出来了.但是如果 ...

  5. BZOJ2141排队——树状数组套权值线段树(带修改的主席树)

    题目描述 排排坐,吃果果,生果甜嗦嗦,大家笑呵呵.你一个,我一个,大的分给你,小的留给我,吃完果果唱支歌,大家 乐和和.红星幼儿园的小朋友们排起了长长地队伍,准备吃果果.不过因为小朋友们的身高有所区别 ...

  6. BZOJ5010 FJOI2017矩阵填数(容斥原理)

    如果只考虑某个子矩阵的话,其最大值为v的方案数显然是vsize-(v-1)size.问题在于处理子矩阵间的交叉情况. 如果两个交叉的子矩阵所要求的最大值不同,可以直接把交叉部分划给所要求的最大值较小的 ...

  7. Json Self referencing loop detected

    Self referencing loop detected......的错误 解决方案: 1 增加  [JsonIgnore]  过滤关联,使其不参与序列化. 这个方法简单粗暴.但是你就没办法获取关 ...

  8. HDU - 1260 (Tickets)

    题意:  买票    一个人要么自己买  要么和前面的人一起买   这两种情况分别有一个买票所花费的时间  求总的花费时间最小 解析: dp[i] 表示前i个人买票总的花费时间 v[i]表示第i个人买 ...

  9. 掌握 MySQL 这 19 个骚操作,效率至少提高3倍

    本文我们来谈谈项目中常用的MySQL优化方法,共19条,利用好这19条方法,会让你的效率提升至少3倍. 1.EXPLAIN 做MySQL优化,我们要善用EXPLAIN查看SQL执行计划. 下面来个简单 ...

  10. Android8.0运行时权限策略变化和适配方案

    版权声明:转载必须注明本文转自严振杰的博客:http://blog.yanzhenjie.comAndroid8.0也就是Android O即将要发布了,有很多新特性,目前我们可以通过AndroidS ...