导致内存泄漏的jQuery代码

以下代码导致内存泄漏（您可以看到发生这种情况的越多，您将鼠标悬停在其中的速度越慢）。不幸的是，我无法在我的办公室下载javascript分析器（我可以，它只会花我几天/周）。导致内存泄漏的jQuery代码

下面是代码，只是一个下拉菜单一些简单的转换：

$(document).ready(function(){ 
    breadcrumbOver = function() { 
     $(this).stop().animate({ backgroundColor: "#3393b5", textIndent: 15 }, 250); 
    } 
    breadcrumbOut = function() { 
     $(this).stop().animate({ backgroundColor: "#738793", textIndent: 0 }, 250); 
    } 
    $("nav ul li").hover(
     function() { 
     $(this).children('ul.child').stop().slideDown('fast').children('li').hover(breadcrumbOver, breadcrumbOut); 
     }, 
     function() { 
     $(this).children('ul.child').stop().slideUp('fast').unbind(breadcrumbOver, breadcrumbOut); 
     } 
    ); 
});

任何人都可以看到内存泄漏可能会出现？

编辑：生动的例子在这里 - http://rcnhca.org.uk/sandbox/（反复翻转“健康，安全和安全”，然后翻转它的孩子看到效果发生，也动画slideDown有时不滚动，如果你进出速度足够快）。

来源

2012-04-12 George Reith

大多数时候，在路上，我们的代码会导致内存泄漏。 – 2012-04-12 15:42:05

您在浏览器开发者工具中发生了什么？如果你看，你的各种动画可能会向你展示自己。你可以从这里讲很多。 – veeTrain 2012-04-12 15:44:40

@veeTrain我只有萤火虫，除了引发这个错误外，没有任何异常显示：“WebGL：无法获得可用的WebGL上下文。”这与Modernizr不是我的剧本有关。 – 2012-04-12 15:54:41

该问题看起来像它可能在您的初始选择器中。它针对所有li标签下ul下nav，其中包括所有的儿童和孙子。

$("nav ul li") ...

这将导致它一hover回调添加到所有li标签nav下，那么当你悬停它增加了又一hover回调。

你可能想要更具体一些，比如专门针对直接的孩子。

$("nav>ul>li")

如果你有孩子类，你也可以使用:not(.child)目标的一切，这不是一个孩子。使用console.log（内置于Chrome或使用Firebug）来记录这些选择器正在拉动什么，以确保获得您所期望的。

来源

2012-04-12 15:45:11 jeremyharris

谢谢我遵循这个建议，但它仍然在发生。如果您感兴趣，我会在http://rcnhca.org.uk/sandbox/上提供一个实例。 – 2012-04-12 15:51:53

我真的没有看到这个例子的任何问题。 – jeremyharris 2012-04-12 15:56:28

徘徊在父母的下拉父母身上之后，很多次儿童的动画变得呆滞和波涛汹涌。 – 2012-04-12 15:59:32

我明白你在说什么乔治;在打开盒子几次之后迅速在元素之间滑动时效果最明显。

也许这会影响你所看到的东西。我读到stop()，觉得它可能会影响你所看到的。您可以在stop()中指定的第一个属性是clearQueue。第二个同样有趣。这里是什么文件说一下吧：

clearQueue A boolean indicating whether to remove queued animation as well. Defaults to false. jumpToEnd A Boolean indicating whether to complete the current animation immediately. Defaults to false.

可能是值得一试的真正通过这样的：

$(this).children('ul.child').stop(true, true)... 
// (or you want the animation to unwind, I suppose) 
$(this).children('ul.child').stop(true)...

另外，我检查了unbind，以及和我不认为你可以像你一样传递两个事件。也许你可以使用这种方式并没有遇到你的问题：

...unbind(breadcrumbOver).unbind(breadcrumbOut);

来源

2012-04-12 16:31:49 veeTrain

感谢+1，你对'unbind（）'说得很对，但是即使我只使用'unbind（）'它应该删除所有绑定的侦听器，问题依然存在。我也尝试过所有不同的停止参数，并且它仍然变慢=/ – 2012-04-13 08:41:43

Bummer ...嗯，我希望你可以依赖用户在他们导航某处之前不会停留多次:-)关于调用'unbind ）'没有任何争论。但是你不是绑定到'儿童'（'li'）'然后解除绑定'儿童'（'ul.child'）'？ – veeTrain 2012-04-13 11:49:46

导致内存泄漏的jQuery代码

回答

相关问题