jQuery - 取消绑定或重新绑定hoverIntent()？

Question

我有一个菜单栏，在上一行显示一组类别。

其中一个类别具有一组子类别。

我有一个悬停意图设置，以便它会在子菜单中向下滑动，并在鼠标离开时向上滑动。

但是，如果我正在查看此类别中的页面，我希望子菜单可见，并突出显示活动类别。我还想确保当通过鼠标与子菜单交互时，一旦鼠标离开，它不会再次向上滑动。

我尝试在此页面中的元素上重新声明hoverIntent函数，但它不起作用，它仍然使用以前的绑定。有没有办法解除之前的hoverIntent的绑定并确保它使用新的？

Answer 1

要绑定和取消绑定 hoverIntent 你应该这样做：

// bind the hoverIntent
$("#demo1 li").hoverIntent(makeTall, makeShort)
// unbind the hoverIntent
$("#demo1 li").unbind("mouseenter").unbind("mouseleave");
$("#demo1 li").removeProp('hoverIntent_t');
$("#demo1 li").removeProp('hoverIntent_s');
// rebind the hoverIntent
$("#demo1 li").hoverIntent(makeTall, makeShort)

Answer 2

我认为这是一个更完整的答案。它执行以下操作：

• 清除所有活动计时器。
• 所有事件都被清除
• 所有对象属性都被清除
• 使用常见的 jQuery 语法，看起来像hoverIntent

代码的本机部分：

(function($) {
   if (typeof $.fn.hoverIntent === 'undefined')
     return;

   var rawIntent = $.fn.hoverIntent;

   $.fn.hoverIntent = function(handlerIn,handlerOut,selector) 
    {
      // If called with empty parameter list, disable hoverintent.
      if (typeof handlerIn === 'undefined')
      {
        // Destroy the time if it is present.
        if (typeof this.hoverIntent_t !== 'undefined') 
        { 
          this.hoverIntent_t = clearTimeout(this.hoverIntent_t); 
        }
        // Cleanup all hoverIntent properties on the object.
        delete this.hoverIntent_t;
        delete this.hoverIntent_s;

        // Unbind all of the hoverIntent event handlers.
        this.off('mousemove.hoverIntent,mouseenter.hoverIntent,mouseleave.hoverIntent');

        return this;
      }  

      return rawIntent.apply(this, arguments);
    };  
})(jQuery);

Answer 3

来自 jQuery 文档：“在最简单的情况下，没有参数，.unbind() 会删除附加到元素的所有处理程序”

Answer 4

我用过：

var elements = $("#main_nav li, #breadcrumb_ul li");
elements.unbind('mouseover mouseout');
delete $(elements).hoverIntent_t;
delete $(elements).hoverIntent_s;