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

Question

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

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

我有一个 hoverIntent 设置，以便它会在子菜单中滑动，并在鼠标离开时滑动。

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

我已经尝试在此页面的元素上重新声明 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;