Sự khác nhau giữa .delegate() và live() là gì?

Question

Kể từ

$("table").delegate("td", "hover", function(){ 
    $(this).toggleClass("hover"); 
}); 

là tương đương với đoạn mã sau được viết bằng .live():

$("table").each(function(){ 
    $("td", this).live("hover", function(){ 
     $(this).toggleClass("hover"); 
    }); 
}); 

theo jQuery API.

Tôi đặt cược tôi sai nhưng không phải là nó giống nhau viết

$("table td").live('hover', function() {}); 

Vì vậy, có chuyện gì là .delegate() cho?

Answer 1

.live() nghe trên document trong đó, .delegate() lắng nghe một yếu tố địa phương hơn, <table> trong trường hợp đó.

Cả hai đều hành động nghe giống nhau cho các sự kiện để bong bóng, số này đến .delegate() chỉ bong bóng ít hơn trước khi bị bắt.

dụ bạn của:

$("table td").live('hover', function() {}); 

là không giống nhau, vì nó một lần nữa gắn một event handler để document và không phải là <table>, vì vậy .delegate() là cho các yếu tố địa phương hơn, hiệu quả hơn trong hầu hết các khía cạnh .. mặc dù nó vẫn sử dụng .live() dưới bìa.

---

Cũng nên nhớ rằng $(selector) lấy các yếu tố, vì vậy $("table td") chọn một loạt các yếu tố thực sự không có lý do chính đáng khi sử dụng .live(), nơi như $("table").delegate() chọn chỉ các <table> yếu tố, vì vậy ngay cả ban đầu đó là hiệu quả hơn bằng cách không chạy bộ chọn và loại bỏ kết quả.

Answer 2

Các doc:

Kể từ khi phương pháp .live() xử lý sự kiện khi họ đã tuyên truyền để phía trên cùng của tài liệu, nó không thể dừng lại tuyên truyền các sự kiện trực tiếp. Tương tự, các sự kiện được xử lý bởi .delegate() sẽ luôn truyền cho phần tử mà chúng được ủy nhiệm; các trình xử lý sự kiện trên bất kỳ phần tử nào bên dưới nó sẽ được thực thi trước khi trình xử lý sự kiện được ủy quyền được gọi.

Answer 3

Cách live() công việc là vì nó đặt một handler trên cấp cao nhất của DOM (tài liệu) phát hiện khi sự kiện của bạn lựa chọn bong bóng lên đến mức đó (và sau đó kiểm tra xem nó đã được ném bởi một phần tử khớp với công cụ chọn của bạn).

delegate() hoạt động theo cùng một cách, nhưng trình xử lý được đặt trên phần tử đã chọn của bạn (vì vậy nó chỉ có thể phát hiện sự kiện được ném bởi con cháu của phần tử đó).

Các nhược điểm của live() là 1) các vấn đề hiệu suất vốn có trong phát hiện và kiểm tra tất cả các sự kiện bong bóng ở cấp tài liệu và 2) thực tế là bạn không thể ngừng truyền bá tất cả các sự kiện đó (kể từ khi bạn thắng) t biết về chúng cho đến khi chúng đạt đến cấp độ tài liệu).

delegate() giảm thiểu cả hai vấn đề đó bằng cách cho phép bạn hạn chế trình xử lý thành tập hợp các phần tử nhỏ hơn (các yếu tố phù hợp với bộ chọn và con cháu của bạn) thay vì toàn bộ trang.