Phương thức off
Phương thức off cho phép gỡ bỏ trình xử lý
sự kiện khỏi phần tử. Để gắn trình xử lý
có thể sử dụng phương thức
off.
Cú pháp
Cách chúng ta xóa trình xử lý sự kiện khỏi phần tử,
tham số đầu tiên truyền vào dưới dạng chuỗi
một hoặc nhiều sự kiện được phân tách bằng
dấu cách, thứ hai - truyền vào bộ lọc chọn lọc
con cháu bổ sung bên trong phần tử
(nó phải khớp với cái chúng ta đã truyền vào
phương thức on khi đính kèm
trình xử lý). Để xóa tất cả các sự kiện ủy quyền,
hãy truyền giá trị '**'. Tham số thứ hai
là tùy chọn. Thứ ba truyền vào hàm xử lý
(mà chúng ta đã đính kèm), hàm này được truyền đối tượng
sự kiện hoặc truyền false:
$(bộ chọn).off(sự kiện, [bộ chọn], hàm-xử-lý(đối tượng sự kiện));
Có thể sử dụng phương thức off theo cách khác,
khi đó tham số đầu tiên truyền vào là
đối tượng JavaScript, trong đó các khóa - loại sự kiện, còn
giá trị - các hàm xử lý mà chúng ta đã thêm vào
phần tử:
$(bộ chọn).off({'loại sự kiện': handler}, [bộ chọn]);
Chúng ta có thể chỉ truyền một tham số dưới dạng
đối tượng jQuery.Event:
$(bộ chọn).off(sự kiện);
Nếu không truyền tham số cho phương thức, thì chúng ta sẽ gỡ bỏ khỏi phần tử tất cả các trình xử lý đã đính kèm:
$(bộ chọn).off();
Ví dụ
Hãy thêm hàm xử lý
testFunc vào các đoạn văn.
Nhưng ngay lập tức xóa trình xử lý khỏi
đoạn văn thứ hai, do đó, nhấp chuột vào đoạn văn thứ hai sẽ không
dẫn đến điều gì cả (nếu chúng ta chú thích dòng cuối cùng
của mã, thì sẽ thấy sự kiện được kích hoạt và
khi nhấp vào đoạn văn thứ hai):
<p id="test1">click1</p>
<p id="test2">click2</p>
function testFunc(event) {
alert(event.data.text);
}
$('#test1').on('click', {text: 'aaa'}, testFunc); // thêm trình xử lý
$('#test2').on('click', {text: 'bbb'}, testFunc); // thêm trình xử lý
$('#test2').off('click', testFunc); // xóa trình xử lý
