1

以下代码导致内存泄漏（您可以看到这种情况发生的越多，越慢，越慢）。不幸的是，我无法在我的办公室下载 javascript 分析器（我可以，只需几天/几周）。

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

$(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 有时不会触发，如果你滚入滚出足够快）。

4

2 回答 2

6

问题看起来可能出在您的初始选择器中。它以 under 下的所有标签为目标，li其中包括所有子代和孙代。ulnav

$("nav ul li") ...

这会导致它为 下的hover所有li标签添加回调nav，然后当您将鼠标悬停时，它会添加另一个hover回调。

您可能希望更具体地使用它，例如专门针对直接子代。

$("nav>ul>li")

如果您有子类，您还可以使用:not(.child)来定位所有非子类。使用console.log（内置于 Chrome 或使用 Firebug）来记录这些选择器正在拉动的内容，以确保您得到您期望的结果。

于 2012-04-12T15:45:11.693 回答
2

我明白你在谈论乔治；多次打开盒子后在元素之间快速滑动时，效果最为明显。

也许这会影响你所看到的。我继续阅读stop()并觉得它可能会对您所看到的产生影响。您可以在其中指定的第一个属性stop()是 clearQueue。第二个同样有趣。以下是文档中的说明：

clearQueue一个布尔值，指示是否也删除排队的动画。默认为假。 jumpToEnd一个布尔值，指示是否立即完成当前动画。默认为假。

可能值得一试，像这样传递真实：

$(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-12T16:31:49.317 回答