jQuery - unbind或rebind hoverIntent()？

Question

我有一个菜单栏,在上排显示一组类别.

其中一个类别有一组子类别.

我有一个hoverIntent设置,以便它将slideDown子菜单,并在鼠标离开时slideUp.

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

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