Phương thức one
Phương thức one cho phép thêm trình xử lý
sự kiện vào phần tử. Sau khi sự kiện
kích hoạt một lần - trình xử lý sẽ
tự động bị xóa.
Cú pháp
Chúng ta gắn trình xử lý sự kiện vào phần tử như sau,
tham số đầu tiên dưới dạng chuỗi
là một hoặc nhiều sự kiện được phân tách bằng
dấu cách, tham số thứ hai - truyền dữ liệu dưới dạng đối tượng JavaScript,
sẽ được truyền đến trình xử lý trong thuộc tính
event.data khi sự kiện kích hoạt. Tham số thứ hai
là tùy chọn. Tham số thứ ba truyền hàm xử lý,
mà đối tượng sự kiện sẽ được truyền vào, hoặc truyền false:
$(selector).one(events, [data], handler(event object));
Có thể truyền bộ lọc selector bổ sung cho phần tử con
làm tham số thứ hai,
thứ ba - dữ liệu bổ sung, sẽ được truyền
đến trình xử lý trong thuộc tính event.data khi
sự kiện kích hoạt. Tham số thứ hai và thứ ba
là tùy chọn. Tham số thứ tư truyền
hàm xử lý, mà đối tượng sự kiện
và các tham số bổ sung tùy chọn sẽ được truyền vào. Nếu thay vì
hàm xử lý truyền false, thì hàm chỉ đơn giản
trả về false:
$(selector).one(events, [selector], [data], handler(event object));
Có thể sử dụng phương thức one theo cách khác,
khi đó tham số đầu tiên truyền
đối tượng JavaScript, trong đó khóa - loại sự kiện, còn
giá trị - hàm xử lý mà chúng ta đã thêm vào
phần tử:
$(selector).one({'event type': handler}, [selector], [data]);
Nếu chúng ta không truyền selector bổ sung, thì sự kiện kích hoạt trên phần tử mà chúng ta gắn trình xử lý, ngược lại - trên phần tử con, phần tử con phù hợp với selector đó (sự kiện ủy thác).
Ví dụ
Hãy thử khi nhấp vào đoạn văn sẽ hiển thị dữ liệu mà
chúng ta đã truyền vào phương thức one. Trong các lần nhấp tiếp theo
sẽ không có gì xảy ra. Chúng ta sẽ sử dụng
hàm xử lý testFunc,
mà chúng ta đã tạo:
<p>click</p>
function testFunc(event) {
alert(event.data.text);
}
$('p').one('click', {text: 'aaa' }, testFunc);
