标签: settimeout

使用时setTimeout,必须将要执行的代码放入字符串中:

setTimeout('alert("foobar!");', 1000);

但是,我想执行一个函数,我在变量中有一个引用.我希望能够这样做:

var myGreatFunction = function() { alert("foobar!"); };
// ...
setTimeout('myGreatFunction();', 1000);

(虽然在现实生活中,警报是一段较长的代码,并myGreatFunction作为参数传递给其他函数,在其中setTimeout调用它.)

当然,当超时触发时,myGreatFunction不是已识别的功能,因此它不会执行.

我希望javascript让我这样做,但它没有:

setTimeout(function() { myGreatFunction(); }, 1000);

这周围有一个很好的方式吗？

我有一个功能,当点击它时显示一个菜单,我希望它在5秒后消失.这是我的javascript - 它可以在桌面浏览器上正常运行,但它不会在移动设备上消失.

$(function() {
    $('#prod_btn').click(function() {
        $(this).addClass('selected').next('ul').css('display', 'block');
        setTimeout(hideMenu, 5000);
    });
});

function hideMenu() {
    $('#prod_btn').removeClass('selected').next('ul').css('display', 'none');
}

问题出在哪儿？

谢谢

我对使用setTimeout和每个迭代器感到困惑.如何重写以下内容,以便控制台在延迟5秒后输出每个名称？目前,以下代码在5秒后立即打印所有名称.我想要:

1)等待5秒,然后打印凯文
2)等待5秒,然后打印迈克
3)等待5秒,然后打印莎莉

var ary = ['kevin', 'mike', 'sally'];

_(ary).each(function(person){

  setTimeout(function(){
    console.log(person);
  }, 5000);    

});

首先,我是javascript的新手,我在setTimeOut中遇到了问题...

这是我的脚本代码........

$('#nav ul li a').hover(function(){
            $(this).next("div").slideDown("fast").siblings("div").slideUp("slow");
            console.log("hover");
        },
        function(){
            setTimeOut(
                function(){
                    if(!$(this).next('div').is(':hover')){
                        $(this).next('div').slideUp('slow');
                    }}
                    ,1000)

        });

这是我的HTML代码.....

        </div> <!-- end of first-row -->                    
        <ul>
            <li>
                <a href="#">Home </a><div class="menu_box box1"></div>
            </li>       
            <li>                
                <a href="#">Place</a><div class="menu_box box2"></div> <!-- end of menu -->
            </li>       
            <li>
                <a href="#">Guide</a><div class="menu_box box3"></div> 
            </li>       
            <li>
                <a href="#">Contact</a>
            </li>       
            <li>
                <a href="#">About Us</a>
            </li>       

        </ul>
    </div> <!-- end of nav -->

请指导我......

我正在将一些JavaScript移植到Dart.我有window.setTimeout一段代码用于在一段时间后运行回调.在某些情况下,该回调会被取消window.clearTimeout.

Dart的相当于什么？我可以new Future.delayed用来替换setTimeout,但我看不到取消它的方法.我也无法找到clearTimeoutDart的电话.

有没有办法找出是否有活跃的计时器？

我有不同持续时间的n计时器,例如:

Timer 1 -> 2-sec

Timer 2 -> 8-sec

..

...

Timer n -> n-sec

我需要知道所有计时器何时完成

HTML

<div id="time-out-1">
   Time out 1:<span></span>
</div>

<div id="time-out-2">
   Time out 2:<span></span>
</div>

<button>
   Are all timers finished ?
</button>

JS

setTimeout(function () {
        $("#time-out-1 span").text("Finished !");
 },2000);


  setTimeout(function () {
        $("#time-out-2 span").text("Finished !");
 },8000);

 $('button').click(function(){
        // if all timers are finished
        // do something
 });

Jsfidle

注意:我需要针对此特定示例的解决方案,因为在我的项目中有n个js文件,这些文件可能具有声明为此示例的计时器

我正在为 React 组件编写 Jest 测试，并使用该@testing-library/user-event库来模拟用户交互。除了使用 Jest 的假计时器的测试之外，这非常有效。

这是一个示例测试：

it(`fires onClick prop function when the button is clicked`, async () => {\n  // jest.useFakeTimers()\n\n  let propFn = jest.fn()\n\n  let app = RTL.render(\n    <SampleComp onClick={propFn} />\n  )\n\n  await userEvent.click(app.queryByText(\'Test button\')!)\n\n  expect(propFn).toHaveBeenCalled()\n\n  // jest.useRealTimers()\n})\n

这是组件：

function SampleComp({ onClick }) {\n  // a simple bridge for debugging\n  function _onClick(e) {\n    console.log(`_onClick invoked`)\n    return onClick(e)\n  }\n\n  return (\n    <button onClick={_onClick}>\n      Test button\n    </button>\n  )\n}\n

如果没有假计时器，测试将在不到一秒的时间内运行并通过。使用假计时器，测试会超时然后失败：

  \xe2\x97\x8f fires …

我在构建Javascript对象时遇到问题,并使用setTimeout调用该对象中的方法.我尝试了各种变通方法,但总是在循环的第二部分中,范围变为窗口对象而不是我的自定义对象.警告:我是javascript的新手.

我的代码:

$(function() {
 slide1 = Object.create(slideItem);
 slide1.setDivs($('#SpotSlideArea'));
 slide1.loc = 'getSpot';
 slide2 = Object.create(slideItem);
 slide2.setDivs($('#ProgSlideArea'));
 slide2.loc = 'getProg';
 slide2.slide = 1;
 setTimeout('triggerSlide(slide1)', slide1.wait);
 setTimeout('triggerSlide(slide2)', slide2.wait);
});

function triggerSlide(slideObject) {
 slideObject.changeSlide(slideObject);
}

var slideItem = {
 div1: null,
 div2: null,
 slide: 0,
 wait: 15000,
 time: 1500,
 loc: null,
 changeSlide: function(self) {
  this.slide ? curDiv = this.div1:curDiv = this.div2;
  $(curDiv).load(location.pathname + "/" + this.loc, this.slideGo(self));
 },
 setDivs: function(div) {
  var subDivs = $(div).children();
  this.div1 = subDivs[0];
  this.div2 = subDivs[1];
 },
 slideGo: function(self) …

我正在构建一个firefox扩展,它创建了几个隐藏的浏览器元素.

我想addProgressListener()为我加载的页面处理onLocationChange.但是,我的处理程序并不总是被调用.

更具体地说,这就是我正在做的事情:

1. 创建一个浏览器元素,而不设置其src属性
2. 将它附加到另一个元素
3. 添加一个侦听onLocationChange浏览器元素的进度监听器
4. loadURIWithFlags()使用所需的网址调用并发布数据

我希望每次在4之后调用处理程序,但有时它不会(虽然它似乎卡在同一页面上).

有趣的是,如果我将3和4包裹在内部,setTimeout(..., 5000);它每次都有效.

我也试过改变一些步骤,但它没有任何效果.

更大的图片:当浏览器contentDocument是新加载的页面(重定向后)时,我希望得到可靠的通知.有一个更好的方法吗？

更新:我已经在mozilla的bug跟踪器上打开了一个错误,其中有一个显示此行为的最小xulrunner应用程序,以防任何人想要仔细查看:https://bugzilla.mozilla.org/show_bug.cgi？id = 941414

例如,有一个名为animationComplete(来自第三方库)的变量和一个名为的函数happenAfterAnimation:

一个简单的解决方案如下所示:

while(!animationComplete) {
   // Do nothing
}
happenAfterAnimation()

或者像这样的更复杂的解决方案:

function tryHappenAfterAnimation() {
  if(animationComplete) {
    happenAfterAnimation()
  } else {
    setTimeout(tryHappenAfterAnimation, 100)
  }

}
setTimeout(tryHappenAfterAnimation, 100)

第一种解决方案可能有一些开销,第二种解决方案看起来有点脏.

正如future/promise当前版本的Javascript所没有的那样,这里的方式可能有点过分......我只是想知道这种情况是否有优雅轻巧的方式..

有没有人有关于更好的方法处理这个问题的想法？谢谢!