*



Bạn đang xem: Preventdefault trong javascript

*

*

*
Khi viết hàm callback cho 1 sự kiện nào kia như click vào trong 1 button để ngăn trình chú ý không xử lý sự khiếu nại click theo như mang định thì cả cha cách viết phần nhiều đưa về hiệu quả gần như nhau, cùng tìm hiểu sự không giống nhau giữa các phương thức này nhé.

1. Event.preventDefault()

Phương thức preventDefault() của đối tượng người tiêu dùng event được áp dụng để ngăn ngừa xử lý mặc định của trình phê duyệt khi xẩy ra sự kiện.Ví dụ đoạn mã sau:

Trang chủKhi người tiêu dùng nhấp vào links liên kết trình chu đáo sẽ hiển thị vỏ hộp thoại lưu ý với nội dung:bạn đã nhấp vào linkđồng thời rào cản trình chăm bẵm chuyển tiếp người tiêu dùng tới trang https://aryannations88.com

2. Event.stopPropagation()

Phương thức stopPropagation() của đối tượng người tiêu dùng event được áp dụng để ngăn không cho sự kiện lan toả lên các phần tử cha của bộ phận diễn ra sự kiện.Ví dụ cùng với đoạn mã sau: Trang chủ

Thì khi người tiêu dùng click vào thành phần a (đồng thời cũng chính là click vào bộ phận p chứa bộ phận a) thì trình trông nom sẽ hiển thị hộp thoại lưu ý với nội dung:

bạn vẫn nhấp vào link tiếp sau event.stopPropagation() sẽ rào cản sự khiếu nại này lan toả tới thành phần cha là thẻ p. Do kia hàm parentEventHandler() sẽ không được hotline và sẽ không tồn tại hộp thoại lưu ý nào được hiện nay ra. Cuối cùng, do trong hàm callback không thực hiện event.preventDefault() nên tiếp nối trình để mắt tới vẫn đã chuyển người tiêu dùng tới trang https://aryannations88.com

3. Return false

Câu lệnh return false trong hàm callback của JavaScript để xử trí một sự kiện thực hiện hai nhiệm vụ:+ ngăn ngừa cách giải pháp xử lý mặc định của trình phê chuẩn khi sự kiện xảy ra y hệt như preventDefault + rào cản sự khiếu nại lan toả tới thành phần cha giống hệt như stopPropagation lấy ví dụ với đoạn mã sau: Trang chủ

Thì khi người dùng nhấp vào link liên kết một vỏ hộp thoại lưu ý được hiển thị với văn bản như sau:

bạn vẫn nhấp vào linkVà sau đó không có bất cứ hành động nào khác diễn ra do return false ngăn cản trình thông qua chuyển tiếp người tiêu dùng tới landing page của liên kết đồng thời rào cản sự kiện bấm chuột lan toả tới thành phần cha p. Xin cảm ơn với hẹn gặp mặt lại chúng ta trong các nội dung bài viết tiếp theo!


Xem thêm: Một Bông Hồng Em Dành Tặng Cô Một Bài Ca Hát Riêng Tặng Thầy Cô Cho Em Mùa Xuân

Khác nhau giữa preventDefault với stopPropagation và return false

*
Reviewed by kentrung on October 29, 2019 Rating: 5