jQuery tương đương với phương pháp addEventListener JavaScript của

Question

Tôi đang cố gắng để tìm ra tương đương jQuery JavaScript gọi phương pháp này:

document.addEventListener('click', select_element, true); 

tôi đã nhận được như xa như:

$(document).click(select_element); 

nhưng điều đó không' t đạt được kết quả tương tự, như tham số cuối cùng của phương thức JavaScript - một boolean cho biết trình xử lý sự kiện có được thực hiện trong giai đoạn bắt giữ hoặc bong bóng (theo hiểu biết của tôi từ http://www.quirksmode.org/js/events_advanced.html) - bị bỏ qua.

Làm cách nào để chỉ định tham số đó hoặc đạt được cùng chức năng, sử dụng jQuery?

Answer 1

Không phải tất cả các trình duyệt hỗ trợ sự kiện chụp (ví dụ, các phiên bản trình duyệt Internet Explorer ít hơn 9 không) nhưng tất cả làm hỗ trợ sự kiện bubbling, đó là lý do tại sao nó là giai đoạn được sử dụng để ràng buộc xử lý các sự kiện trong tất cả các trừu tượng trình duyệt chéo, bao gồm jQuery.

gần nhất với những gì bạn đang tìm kiếm trong jQuery đang sử dụng bind() (thay thế bởi on() trong jQuery 1.7+) hoặc trường hợp cụ thể phương pháp jQuery (trong trường hợp này, click(), trong đó kêu gọi bind() nội anyway). Tất cả đều sử dụng pha bọt của một sự kiện lớn lên.

Answer 2

Điều gần nhất sẽ là function bind:

http://api.jquery.com/bind/

$('#foo').bind('click', function() { 
    alert('User clicked on "foo."'); 
}); 

Answer 3

Tính đến jQuery 1.7, .on() bây giờ là phương pháp ưa thích của các sự kiện ràng buộc, chứ không phải là .bind():

Từ http://api.jquery.com/bind/:

Tính đến jQuery 1.7, phương pháp .Trên() là ưa thích phương pháp cho gắn trình xử lý sự kiện vào tài liệu. Đối với các phiên bản trước, phương thức .bind() được sử dụng để đính kèm trình xử lý sự kiện trực tiếp vào các phần tử . Trình xử lý được gắn với các phần tử hiện được chọn trong đối tượng jQuery là , vì vậy các phần tử đó phải tồn tại tại thời điểm cuộc gọi tới .bind() xảy ra. Để có sự kiện ràng buộc linh hoạt hơn, hãy xem cuộc thảo luận của sự kiện ủy quyền trong .on() hoặc .delegate().

Các trang tài liệu nằm ở http://api.jquery.com/on/

Answer 4

Bây giờ bạn nên sử dụng chức năng .on() để ràng buộc các sự kiện.

Answer 5

Dưới đây là một điều trị tuyệt vời trên Mạng Phát triển Mozilla (MDN) về vấn đề này cho chuẩn JavaScript (nếu bạn không muốn phải dựa vào jQuery hoặc hiểu nó tốt hơn nói chung):

https://developer.mozilla.org/en-US/docs/DOM/element.addEventListener

đây là một cuộc thảo luận về dòng sự kiện từ một liên kết trong việc điều trị trên:

http://www.w3.org/TR/DOM-Level-3-Events/#event-flow

một số điểm chính như sau:

• Nó cho phép bổ sung thêm hơn một handler duy nhất cho một sự kiện
• Nó cung cấp cho bạn kiểm soát tốt hơn-grained của giai đoạn khi người nghe được kích hoạt (chụp vs bọt)
• Nó hoạt động trên bất kỳ phần tử DOM, không chỉ các phần tử HTML
• Giá trị của "điều này" được chuyển đến sự kiện không phải là đối tượng chung (cửa sổ), nhưng phần tử mà từ đó phần tử được kích hoạt. Điều này rất thuận tiện.
• Mã cho di sản trình duyệt IE là đơn giản và bao gồm dưới tiêu đề "Legacy Internet Explorer và attachEvent"
• Bạn có thể bao gồm các thông số nếu bạn gửi kèm theo xử lý trong một chức năng ẩn danh

Answer 6

Một điều cần lưu ý là Các phương thức sự kiện jQuery không kích hoạt/trap load trên embed các thẻ có chứa SVG DOM tải dưới dạng tài liệu riêng biệt trong thẻ embed. Cách duy nhất tôi tìm thấy để bẫy một sự kiện load trên các sự kiện này là sử dụng JavaScript thô.

này sẽ không làm việc (Tôi đã thử on/bind/load phương pháp):

$img.on('load', function() { 
    console.log('FOO!'); 
}); 

Tuy nhiên, hoạt động này:

$img[0].addEventListener('load', function() { 
    console.log('FOO!'); 
}, false);