Thuộc tính sự kiện có thể hủy HTML DOM được liên kết với các sự kiện HTML vì JavaScript có thể phản ứng với các sự kiện này. Thuộc tính sự kiện có thể hủy trả về một Boolean true hoặc false cho biết liệu sự kiện có thể bị hủy hay không.
Cú pháp
Sau đây là cú pháp cho thuộc tính sự kiện có thể hủy -
event.cancelable
Ví dụ
Hãy để chúng tôi xem một ví dụ về thuộc tính sự kiện có thể hủy -
<!DOCTYPE html>
<html>
<body>
<p>Hover over the button below to find out if onmouseover is cancellable event or not</p>
<button onmouseover="cancelFunction(event)">CLICK IT</button>
<p id="Sample"></p>
<script>
function cancelFunction(event) {
var x = event.cancelable;
if(x==true)
document.getElementById("Sample").innerHTML = "The onmouseover event is cancellable";
else
document.getElementById("Sample").innerHTML = "The onmouseover event is not
cancellable";
}
</script>
</body>
</html> Đầu ra
Điều này sẽ tạo ra kết quả sau -
Khi di chuột qua nút NHẤP VÀO NÓ -
Đầu tiên, chúng tôi đã tạo một nút BẤM VÀO NÓ khi di chuột qua sẽ chuyển đối tượng sự kiện ommouseover tới phương thức hủy bỏ chức năng (sự kiện).
<button onmouseover="cancelFunction(event)">CLICK IT</button>
Phương thức hủy bỏ chức năng (sự kiện) kiểm tra giá trị event.cancelable cho đối tượng sự kiện được truyền và gán nó cho biến x. Sử dụng câu lệnh có điều kiện, chúng tôi kiểm tra xem event.cancellable trả về true hay false và sau đó hiển thị thông báo phù hợp trong thẻ đoạn văn có id bằng “Sample” -
function cancelFunction(event) {
var x = event.cancelable;
if(x==true)
document.getElementById("Sample").innerHTML = "The onmouseover event is cancellable";
else
document.getElementById("Sample").innerHTML = "The onmouseover event is not cancellable";
}