E.Preventdefault() Là Gì – Preventdefault() Trong Jquery

Mỗi sự kiện tất cả chúng ta hoàn toàn có thể có nhiều hành vi. Ví dụ bạn có một sự kiện là dịch Covid-19 thì bạn sẽ có những hành vi trong sự kiện đó là đeo khẩu trang, làm remote, tự cách ly bản thân, …Bạn đang xem : E.preventdefault ( ) là gìKhi ta thao tác với javascript nói chung và event trong Javascript nói riêng .

Chúng ta thường hiểu và biết đến sự kiện là một hành động nào đó tác động lên đối tượng HTML mà ta có thể bắt được sự kiện này và thực hiện những hành động nào đó.

Tóm TắtKhi viết hàm callback cho một sự kiện nào đó như click vào một button để ngăn trình duyệt không xử lý sự kiện click theo như mặc định thì thường tất cả chúng ta có những method để giải quyết và xử lý event sau khi giải quyết và xử lý callback xong. Chúng ta sẽ lướt qua xem chúng là gì nhé :Event. createEvent ( )Tạo một sự kiện mới, sự kiện này sau đó phải được khởi tạo bằng cách gọi phương pháp initEvent ( ) của nó .Event. composedPath ( )Trả về đường dẫn của sự kiện ( những đối tượng người tiêu dùng mà người nghe sẽ được gọi ). Điều này không gồm có những nodes trong shadow trees nếu shadow root được tạo bằng chính sách ShadowRoot. mode bị đóng .Event. initEvent ( )Khởi tạo giá trị của một Sự kiện được tạo. Nếu sự kiện đã được gửi đi, chiêu thức này không có công dụng gì .Event. preventDefault ( )Hủy sự kiện ( nếu hoàn toàn có thể hủy ) .Xem thêm : Hợp Chất Có Hoạt Tính Sinh Học Là Gì, Hoạt Chất Sinh Học Là GìEvent. stopImmediatePropagation ( )Đối với sự kiện đơn cử này, hãy ngăn tổng thể những người nghe khác được gọi. Điều này gồm có những trình nghe được gắn với cùng một thành phần cũng như những thành phần được gắn với những thành phần sẽ được duyệt qua sauEvent. stopPropagation ( )Ngừng truyền những sự kiện trong DOM .

Nhưng hôm nay chúng ta sẽ đi sâu vào 3 sự kiện chính hay sử dụng như tiêu đề bài viết có nhắc đến .

1. Event.preventDefault1. Event. preventDefaultNguồn ảnh : https://alligator.io/js/preventdefault/Phương thức preventDefault ( ) của đối tượng người dùng event được sử dụng để ngăn ngừa cách giải quyết và xử lý mặc định của trình duyệt khi xảy ra sự kiện .Ví dụ đoạn mã sau :a href = ” www.https : / / thichvivu.net/ ” > Trang chủ / a > script type = ” text / javascript ” > $ ( ” a ” ). click ( function ( event ) { alert ( ” Bạn nhấn vào link rồi ” ) ; event. preventDefault ( ) } ) ; / script > thì khi người dùng nhấp vào link link trình duyệt sẽ hiển thị hộp thoại cảnh báo nhắc nhở với nội dung :Bạn nhấn vào link rồiđồng thời ngăn cản trình duyệt chuyển tiếp người dùng tới trang đích của link link .2. Event.stopPropagation2. Event. stopPropagationPhương thức stopPropagation ( ) của đối tượng người tiêu dùng event được sử dụng để ngăn không cho sự kiện lan toả lên những thành phần mẹ của thành phần mà ở đó diễn ra sự kiện .Ví dụ với đoạn mã sau :Trang chủThì khi người dùng click vào thành phần p ( đồng thời cũng là click vào thành phần a chứa thành phần p ) thì trình duyệt sẽ hiển thị hộp thoại cảnh báo nhắc nhở với nội dung :Bạn đã nhấp vào thành phần pTiếp theo, sử dụng event. stopPropagation ( ) trong hàm callback xử lý sự kiện nhấp chuột vào thẻ p link sẽ ngăn cản sự kiện này lan toả tới thành phần mẹ a. Do đó hàm parentEventHandler ( ) sẽ không được gọi và sẽ không có hộp thoại cảnh báo nhắc nhở nào khác được hiện ra .Cuối cùng, vì trong hàm callback không sử dụng event. preventDefault ( ) nên sau đó trình duyệt vẫn sẽ chuyển người dùng tới trang chủ www.honamphoto.com .3. Event.stopImmediatePropagation3. Event. stopImmediatePropagation

stopPropagation sẽ ngăn bất kỳ trình xử lý cha mẹ nào được thực thi stopImmediatePropagationsẽ ngăn bất kỳ trình xử lý cha mẹ nào và bất kỳ trình xử lý nào khác thực thi

Ví dụ với đoạn mã sau:

exampleXử lý phía Javascript

$(“p”).click(function(event) { event.stopImmediatePropagation();}); $(“p”).click(function(event) { // Chức năng này sẽ không được thực thi $(this).css(“background-color”, “#f00”);});

Source: https://thichvivu.net
Category: Hỏi – Đáp