javascript - jQuery 点击事件可以解除绑定(bind)或重置吗？

Question

我在我正在处理的网页上发现资源泄漏。

此网页有两个文本字段，点击后会显示一个模式对话框，向后端执行数据请求，然后在表格中显示该信息，用户可以从中选择一个条目用于他们最初点击的文本框中。

我像这样将点击事件绑定(bind)到文本框:

var $field = $('#one-of-the-text-fields');

$field.click(function () {
        App.DialogClass.show();
        App.DialogClass.PopulateTable();
        App.DialogClass.GotoPageButtonAction(actionArgs);  // Offender!
});

...调用...

App.DialogClass = (function($) {

var pub {},
    $gotoPage = $('#pageNumberNavigationField'),
    $gotoPageButton = $('#pageNumberNavigationButton');

// ...SNIP unimportant other details...

pub.GotoPageButtonAction = function (args) {
    $gotoPageButton.click(function () {
        var pageNumber = $gotoPage.val();
        pub.PopulateTable(args);   // Breakpoint inserted here...
    });
};

return pub;

})(jQuery);

我注意到泄漏是因为当我使用 Chrome 的 JavaScript 调试器运行时，每次单击不同的按钮时我总是会遇到一个额外的断点(例如，我第一次单击字段 A 时，断点被命中两次。当之后我点击字段 B，断点被击中 3 次。如果我在 那个 之后单击 A，断点被击中四次。根据需要推断。)

在我的代码中，我没有对给定字段的现有点击事件做任何事情。我怀疑我的泄漏源于事件没有得到清理这一事实。也就是说，我对 JavaScript/jQuery 也不是很熟悉。从控件中删除点击事件有哪些技巧？

Answer 1

当然。解除绑定(bind):

$field.unbind('click');

但是，请记住，这将删除所有 的点击事件处理程序，而不仅仅是您的。为了安全起见，您应该在绑定(bind)处理程序时使用 namespace :

$field.bind('click.mynamespace', function(){
    // do something
});

然后，

$field.unbind('click.mynamespace');

那么，只有您的处理程序会被删除。