我应该删除 jQuery 中的事件侦听器吗？

Question

我的网站在 jQuery + AJAX 上运行并且有唯一的 javascript 文件，当用户打开任何页面时加载一次，所以我习惯于添加事件监听器所有元素如：$(document).on(...).

一段时间后，我发现代码中 .on(...) 太多了，我很害怕。我服用了 9 颗药丸，并在每次用户单击 link / 后退按钮时强制它删除无用的侦听器。

function page_reload(){
   if(c.r == 'http://example.com/page1'){
      $(document).on('click', '#send', func.send);
      $(document).on({mouseenter: func.me, mouseleave: func.ml}, '#chan');
   }else{
      $(document).off('click', '#send');
      $(document).off('*', '#chan');
   }
}

所以有什么意义吗？也许很多听众做了我不知道的坏事？

Answer 1

当您将侦听器附加到事件时，它确实会占用内存并且可能（如果完全未检查）会导致与内存相关的问题。根据我的经验，最好在你的对象中使用 cleanup 方法，当某个事件触发时，你可以使用你的 .off() 方法注销你的事件监听器。

这些类型的方法的特定逻辑会因您的项目而异，但形式如下：

var MyApp = {
  cleanup: function cleanMyApp(event) {
    this.off('#myId1', myMethod1);
    this.off('#myId2', myMethod2);
  }
}

$('document').on('ready', function() {
  $(document).on('importantEvent', function(event) {
    event.preventDefault(); // if you need to
    MyApp.cleanup();
  });
  // or 
  $('#elem').on('something', MyApp.cleanup);
});

所以是的，一次注册过多的侦听器可能会导致问题，但您可以使用浏览器的开发工具等监控内存使用情况。特别是你可以运行堆栈（和堆？）内存不足并可能使浏览器崩溃。

关于处理这类问题，也有很好的答案here。

我应该删除 jQuery 中的事件侦听器吗？

Should I remove event listeners in jQuery?

javascript

jquery

event-handling