Hủy hành động mặc định trong JavaScript
Đôi khi cần sử dụng JavaScript để hủy hành động mặc định của một thẻ. Ví dụ, khi nhấp vào một liên kết thì hủy việc chuyển hướng theo liên kết đó. Thông thường điều này cần thiết trong trường hợp chúng ta chỉ sử dụng liên kết đó đơn giản để chạy một đoạn mã nào đó. Trong trường hợp này, việc nhấp vào liên kết sẽ dẫn đến chuyển hướng theo nó là điều chúng ta hoàn toàn không mong muốn.
Việc hủy hành động mặc định được thực hiện
bằng đối tượng Event. Để làm điều này,
nó có một phương thức đặc biệt preventDefault(),
phương thức này nên được gọi ở bất kỳ vị trí nào trong trình xử lý
sự kiện.
Hãy thử trên thực tế. Giả sử chúng ta có một liên kết như thế này:
<a href="/" id="elem">liên kết</a>
Hãy làm sao để khi nhấp vào liên kết không xảy ra chuyển hướng sang trang khác:
let elem = document.querySelector('#elem');
elem.addEventListener('click', function(event) {
event.preventDefault();
console.log('Bạn không thể chuyển hướng theo liên kết này!');
});
Cho các liên kết. Hãy làm sao để khi nhấp vào một liên kết, href của nó được ghi vào cuối liên kết, và việc chuyển hướng theo liên kết không xảy ra.
Cho hai ô nhập liệu, một đoạn văn và một liên kết. Giả sử các ô nhập liệu nhận số. Hãy làm sao để khi nhấp vào liên kết, tổng của các số đã nhập sẽ được ghi vào đoạn văn.
