在javascript中未使用的事件处理程序发生内存泄漏

我处于某种情况，在这种情况下，我做了很多ajax调用来更改html的相同部分。这个html代表一个网格。在ajax调用中更改html后，我将事件处理程序附加到网格事件。当用户点击一个刷新按钮时，我执行相同的ajax调用来设置新的html代码，并且再次添加一个事件处理程序来监听网格事件。在javascript中未使用的事件处理程序发生内存泄漏

我想知道如果每次我刷新我的网格并添加一个新的事件处理程序，如果上一个事件处理程序仍在内存中，并且如果是的话，这种情况下最好的做法是什么？（例如，如果存在把新的HTML之前解除绑定的事件处理程序）

这里是我做的一个例子：

$.get(this.config.actionLoggingUserListUrl, viewModel, function (data) { 
    MyNamespace.ui.hideGridAnimation($("#LoggingActionUsersList")); 

    if (data.success) { 
     $("#validationSummary").html(""); 

     $("#usersList").html(data.result); 

     $("#LoggingActionUsersList").click(function() { 
      console.log("Here is my event handler attached multiple times!"); 
     }); 
    } 
    else { 
     $("#validationSummary").html(data.result); 

     $("#usersList").html(""); 
    } 
});

请注意，我在这种情况下，谈论的事件处理程序是：

$("#LoggingActionUsersList").click(function() { 
    console.log("Here is my event handler attached multiple times!"); 
});

来源

2012-08-23 Samuel

您肯定会在每次运行代码时为其添加新的事件处理程序。您可以使用“解除绑定”来解除绑定，或者只是跟踪处理程序是否已经绑定。 – Pointy

jQuery'.html（）'隐式地清除了被'.html（）'替换的元素中的任何（jQuery）处理程序和（jQuery） - 数据。所以如果你正在附加一个处理程序的这个元素被上面的'.html（）'调用所取代，那么你不需要明确地分离它。 – Esailija

事件处理程序堆栈，所以是的，这是一个memork泄漏。可能是相当不重要的一个，但它的原理比效果更重要。除非由于某些原因，你确实需要动态事件处理程序（由于没有太多实际用途，所以很少使用它），所以我强烈建议将事件处理程序分配从ajax调用中提取出来。

如果您确实需要更改事件处理程序，那么巧妙的方法是让您的事件处理程序足够聪明，以便知道它分配的对象的一些细节。这样，不是每次都添加一个新事件，只需要事件处理程序中的逻辑根据对象的当前标识执行不同的操作。

来源

2012-08-23 16:48:08

这可能也适用于清除堆栈，并且将会是一个简单的更改：'$（“＃LoggingActionUsersList”）。unbind（）。click（...）' – Nenotlep

“由于它没有太多实际用途”每当你附加一个带参数的事件处理函数时，你必须在函数中包含参数，不是吗？除了从'this'值获取所有动态信息之外，还有解决方案吗？ –

为什么你每次打电话都要绑定它？

您每次都添加到堆栈中。你并没有取代它。最好的解决方案是使用并做一次。

其他解决方法是在添加单击事件之前解除绑定单击事件。这个解决方案的问题是，如果还有其他事情添加了点击事件，您只是将其删除。

来源

2012-08-23 16:40:50 epascarello

在javascript中未使用的事件处理程序发生内存泄漏

回答

相关问题