如果事件处理程序尚不存在,如何绑定它?

FtD*_*Xw6 24 jquery drag-and-drop event-handling

我有一个页面,我想将拖放事件绑定到.我希望浏览器中的整个页面成为放置目标,因此我将事件绑定到document对象上.我的应用程序的内容通过AJAX加载到主内容区域,我只希望这些事件处理程序在上传页面当前可见时处于活动状态.

现在,我在检索上传页面时绑定事件处理程序; 但是,每次上传页面变为活动状态时,它都会绑定一个新的事件处理程序,这会导致处理程序在用户转到上传页面时离开多次,然后返回.我想我可以解决这个问题,如果我只能在它尚未绑定时才能使处理程序绑定.这是可能的,还是我忽略了一个更好的选择?

相关代码,如果有帮助:

$(document).bind('dragenter', function(e) {
    e.stopPropagation();
    e.preventDefault();
}).bind('dragover', function(e) {
    e.stopPropagation();
    e.preventDefault();
}).bind('drop', function(e) {
    e.stopPropagation();
    e.preventDefault();
    self._handleFileSelections(e.originalEvent.dataTransfer.files);
});
Run Code Online (Sandbox Code Playgroud)

Fel*_*ing 32

在绑定新事件处理程序之前取消绑定现有事件处理程序.对于命名空间事件[docs],这非常简单:

$(document)
  .off('.upload') // remove all events in namespace upload
  .on({
      'dragenter.upload': function(e) {
          e.stopPropagation();
          e.preventDefault();
      },
      'dragover.upload': function(e) {
          e.stopPropagation();
          e.preventDefault();
      },
      // ...
  });
Run Code Online (Sandbox Code Playgroud)

  • 我不得不使用`bind()`和`unbind()`而不是`on()`和`off()`,但这种方法效果很好.谢谢! (2认同)