2013-10-25 15 views
6

Vì vậy, tôi có điều này jquery-App nơi tôi ràng buộc:Làm thế nào để nối lại các sự kiện jquery để tải nội dung thông qua ajax KHÔNG làm điều này cho tất cả các sự kiện/lớp

  • một "xóa chức năng" cho tất cả" .btn của tôi -delete "yếu tố
  • một "thêm chức năng" cho tất cả của tôi" .btn-thêm" yếu tố

và vân vân. Trong một div của webapp của tôi, tôi tải nội dung không đồng bộ, bao gồm các phần tử mà tôi muốn ràng buộc các chức năng "xóa" và "thêm" vào. Các phần tử này cũng có lớp "btn-delete" hoặc "btn-add" - nhưng vì nội dung được tải không đồng bộ nên các sự kiện không bị ràng buộc với chúng mà không làm gì đó.

Vì vậy, tôi nghe nói rằng với hàm .on ('click' ...) có thể được kích hoạt ngay sau khi tải nội dung không đồng bộ, tôi có thể rebind các chức năng này. Nhưng tôi sẽ phải làm điều đó cho mọi chức năng mà tôi muốn sử dụng. Điều đó tôi không muốn.

Điều tôi muốn là có một hàm chung để rebinds TẤT CẢ các hàm sự kiện đã định nghĩa trước đó cho mọi phần tử trong div-container mà tôi đã nạp chúng vào.

Có cách nào để làm điều gì đó như:

"rebind tất cả các sự kiện không đồng bộ chức năng để nạp các yếu tố bên trong div id xyz"

Nó sẽ làm cho dễ dàng hơn cuộc sống của tôi rất nhiều nếu tôi không phải rebind mọi chức năng với mọi callback bằng tay.

Trả lời

16

Nếu bạn sử dụng xử lý sự kiện được ủy quyền, bạn không bao giờ phải liên kết lại.

$('body').on('click', '.btn-delete', function(ev) { 
    // delete ... 
}); 

Điều đó thiết lập trình xử lý sự kiện nắm bắt các sự kiện "nhấp" khi chúng bong bóng đến cơ thể từ bất kỳ phần tử nào, bất kỳ lúc nào. Nó hoạt động trên bất kỳ "click" nào từ một phần tử khớp với bộ chọn đã cho. Cho dù nút đã có ban đầu hoặc được thêm tự động không quan trọng.

Bạn không phải đặt trình xử lý trên phần tử <body>; họ có thể đi vào bất kỳ lớp container nào.

+2

Nó không ảnh hưởng đến hiệu suất? –

+2

@HamedMomeni no, không có vấn đề về hiệu suất có ý nghĩa với trình xử lý sự kiện được ủy quyền. Bộ chọn chỉ cần được kiểm tra dựa vào một phần tử DOM tại một thời điểm. – Pointy

Các vấn đề liên quan