【问题标题】:SetInterval within jQuery .each()jQuery .each() 中的 SetInterval
【发布时间】:2011-08-08 22:03:33
【问题描述】:

我希望遍历一组 div 并在随机时间执行一些随机操作。我正在尝试使用以下函数,但 console.log 在每次迭代时返回相同的对象和整数。执行以下操作的正确方法是什么?

    $('.cloud').each(function() {
    $cloud = $(this);
    ranNum = Math.floor(Math.random() * 5000);
    setInterval(function() {
        setTimeout("console.log($cloud + ranNum)", ranNum)
    })
})          

【问题讨论】:

  • 为什么是 setInterval?你甚至没有指定超时!

标签: javascript jquery function


【解决方案1】:

这里有很好的答案。我要补充一点,因为您没有声明 ranNum 它最终成为一个全局变量,并且循环的每次迭代都将覆盖以前的值而不是创建一个新变量。因此,您在日志输出中看到的数字将始终是在循环的最后一次迭代中产生的随机值。

所以,总是声明你的变量!

【讨论】:

    【解决方案2】:

    通过var 使用局部(闭包)变量

    因为您将功能作为字符串提供,所以您必须使用全局变量。您的代码应该使用在事件匿名函数闭包中定义的局部变量编写,如下所示:

    $('.cloud').each(function() {
        var $cloud = $(this);
        var ranNum = Math.floor(Math.random() * 5000);
        setInterval(function() {
            // $cloud won't have any particular meaning though
            console.log($cloud + ranNum);
        }, ranNum);
    });
    

    setIntervalsetTimeout 的异常组合

    我也看不出您使用间隔和超时的原因?使用一个。可能是间隔,因为您希望重复执行某些内容。

    【讨论】:

    • 这成功了。我最初宣布它们是全球性的,但没有提及。谢谢!
    • @jnolte:不客气。并感谢您接受我的回答。
    【解决方案3】:

    你的函数有一些问题,所以我将在之后重写并解释:

    $('.cloud').each(function(i,d) {
        var cloud = $(this);
        var randNum = Math.floor(Math.random() * 5000);
    
        setTimeout(function(){
            console.log(cloud + ranNum)
        }, randNum );
    });
    

    我不明白你为什么要输出 cloud 变量,因为这只会显示 HTMLElement 或类似的东西。另外,你试图把一个定时器放在一个区间内,两者都是一样的,但是区间会一直循环,定时器会输出一次。

    如果您尝试输出您引用的数字云。使用i 而不是cloud

    尝试更简洁地定义变量,这不是 PHP,避免使用 $ 并且不要忘记 var 作为初始定义和 ;结束语句!

    希望这会有所帮助。

    【讨论】:

    • 在 jQuery 对象前加上 $ 是很常见的——它完全有效。但是,我只会为 var $this = $(this); 这样做,并且不要在其他 jQuery 对象前加上 $
    • @ThiefMaster:对$this 完全有效,是的,其他一切都相当分散注意力,因为您开始到处看到 jquery 选择器。
    • 我认为使用 $ 是有理由的。尽管它本质上是匈牙利语,但 jQuery 引入了一个表示一个或多个 DOM 元素的对象,并且许多函数可以接受 DOM 元素或 jQuery 对象。无论您使用的是 DOM 元素还是 jQuery 对象,都很容易混淆,因为它们有时(但不总是)可以互换,并且您经常在它们之间来回转换。此约定可以帮助您避免因此而导致的错误。
    【解决方案4】:

    请.. 永远不要使用字符串作为第一个 setInterval/setTimeout 参数

    $('.cloud').each(function () {
        var $cloud = $(this);
        var ranNum = Math.floor(Math.random() * 5000);
        setTimeout(function () {
            console.log($cloud, ranNum);
        }, ranNum);
    });
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2017-03-28
      • 1970-01-01
      • 2013-01-26
      • 1970-01-01
      • 2020-11-16
      • 2011-07-19
      相关资源
      最近更新 更多