0

我处于一种情况，我进行了很多 ajax 调用来更改 html 的同一部分。这个 html 代表一个网格。在 ajax 调用中更改 html 后，我将事件处理程序附加到网格的事件。当用户单击刷新按钮时，我执行相同的 ajax 调用来设置新的 html 代码，并再次添加一个事件处理程序来侦听网格的事件。

我想知道每次刷新我的网格并添加一个新的事件处理程序是否前一个事件处理程序仍在内存中，如果是，在这种情况下的最佳做法是什么？（例如，如果在放置新 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!");
});
4

2 回答 2

1

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

您每次都在添加到堆栈中。你没有替换它。最好的解决方案是使用并执行一次。

其他解决方案是在添加点击事件之前取消绑定点击事件。这个解决方案的问题是，如果有其他任何东西添加了点击事件，你只是删除了它。

于 2012-08-23T16:40:50.273 回答
1

事件处理程序堆栈，所以是的，这是一个内存泄漏。可能是一个相当微不足道的问题，但它更多的是原理而不是效果。除非出于某种原因您确实需要动态事件处理程序（很少使用，因为它没有太多实际用途），否则我强烈建议将事件处理程序分配从 ajax 调用中提取出来。

如果您确实需要更改事件处理程序，那么聪明的方法是让您的事件处理程序足够聪明，以便对分配给它的对象有一点了解。这样，您就可以让事件处理程序中的逻辑根据对象的当前身份做不同的事情，而不是每次都添加一个新事件。

于 2012-08-23T16:48:08.167 回答