切换 jQuery 事件状态(开/关)，而不再次指定处理程序

Question

我有一个元素，它有悬停（mouseenter/mouseout）事件和与之关联的处理程序。我想停用此事件一次，直到我的页面加载或执行操作，然后我希望可以在不再次指定相同处理程序的情况下重新激活它。

如果我做这样的事情：

$(element).on('mouseout', handler); //Initial state when i prepare my object
$(element).off('mouseout'); //To turn off the event for the time-being.

在这里，如果我想重新打开/重新关联事件，我也必须重新分配处理程序。

我的要求是这样的：

1. 我绑定事件和处理程序：

    $(element).on('eventName', handler)
   

2. 法典：

    $(element).freezeEvent(); //It wont trigger the mouseenter/mouseout event.
   

3. 法典：

    $(element).unFreezeEvent(); //It will make mouseenter/mouseout event and its original handler to be called up.
   

请指教。步骤和流程必须仅以这种方式进行。

Answer 1

一个非常简单的解决方案是在处理程序本身中处理冻结。

var handler = function (event) {
  if (!$(event.target).isFrozen()) {
     // do whatever you like...
  }
}

jQuery扩展：

$.fn.freeze = function () {
  return this.each(function () {
    $(this).data('frozen', true);
  });
}
$.fn.unfreeze = function () {
  return this.each(function () {
    $(this).data('frozen', false);
  });
}
$.fn.isFrozen = function () {
  return !!this.eq(0).data('frozen');
}

冻结和解冻元素，如下所示：

$(element).freeze(); // returns jQuery object for chaining
$(element).unfreeze(); // returns jQuery object for chaining

获取当前状态：

var state = $(element).isFrozen(); // returns true or false

为了确保您的处理程序在附加后不会立即触发，只需在附加之前冻结元素：

$(element).freeze().on('someEvent', handler);