jQuery - unbind hoặc rebind hoverIntent()?

Question

Tôi có một thanh trình đơn hiển thị một tập hợp các danh mục ở hàng trên.

Một trong các danh mục có một tập hợp các danh mục phụ.

Tôi có thiết lập hoverIntent để nó sẽ trượtDanh mục phụ và trượt lên khi con chuột rời khỏi.

Tuy nhiên, nếu tôi đang xem một trang trong danh mục này, tôi muốn menu con hiển thị với danh mục hiện hoạt được tô sáng. Tôi cũng muốn đảm bảo rằng khi menu phụ được tương tác với thông qua chuột, nó không trượt lên một lần nữa khi con chuột rời đi.

Tôi đã thử redeclaring chức năng hoverIntent trên phần tử trong trang này nhưng nó không hoạt động, nó vẫn đang sử dụng liên kết trước đó. Có cách nào để unbind hoverIntent trước đó và chắc chắn rằng nó sử dụng mới?

Answer 1

để ràng buộc và unbind hoverIntent bạn nên làm:

// 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

Từ tài liệu jQuery: "Trong trường hợp đơn giản nhất, không có đối số, .unbind() loại bỏ tất cả các bộ xử lý gắn liền với các yếu tố"

Answer 3

Tôi nghĩ đây là câu trả lời hoàn chỉnh hơn. Nó thực hiện như sau:

• Bất kỳ bộ hẹn giờ hoạt động nào cũng được làm sạch.
• Tất cả các sự kiện được xóa
• Tất cả các thuộc tính đối tượng bị xóa
• Sử dụng cú pháp jQuery chung và trông giống như một phần tự nhiên của hoverIntent

Code:

(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 4

tôi đã sử dụng:

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