zoukankan      html  css  js  c++  java
  • js设定延迟时间的函数

    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 才不慌不忙地出现。其实我们是有办法让预览区跟输入框同步地,在此我没有给出答案,因为上面所说的,就是解决思路

  • 相关阅读:
    python之SSH远程登录
    Visual Studio 2010發行Windows Form應用程式後,出現【System.ArgumentNullException 未處理】的解決方式
    VS中CreateImageFromResources函数的“null”的值对于“stream”无效的错误
    IIS发布网站后局域网中无法访问
    World2013中三个减号或等号再回车产生的分割线的删除和设置
    在Sql Server 数据库还原出现 3154错误
    批处理命令(bat)设置环境变量
    Markdown首行缩进
    站在数学之巅沐浴计算机的阳光
    MarkDown(LaTex) 数学公式
  • 原文地址:https://www.cnblogs.com/zoro-zero/p/4245186.html
Copyright © 2011-2022 走看看