Sự kiện JavaScript
Sự kiện HTML là "những điều" xảy ra với các phần tử HTML.
Khi JavaScript được sử dụng trong các trang HTML, JavaScript có thể "phản ứng" với những sự kiện này.
Sự kiện HTML
Một sự kiện HTML có thể là điều gì đó mà trình duyệt thực hiện hoặc điều gì đó mà người dùng thực hiện.
Dưới đây là một số ví dụ về các sự kiện HTML:
- Một trang web HTML đã tải xong
- Trường nhập HTML đã được thay đổi
- Một nút HTML đã được nhấp vào
Thông thường, khi sự kiện xảy ra, bạn có thể muốn làm điều gì đó.
JavaScript cho phép bạn thực thi mã khi phát hiện sự kiện.
HTML cho phép thêm các thuộc tính xử lý sự kiện, với mã JavaScript , vào các phần tử HTML.
Với dấu ngoặc đơn:
< element
event = ' some JavaScript ' >
Với dấu ngoặc kép:
< element
event = " some JavaScript " >
Trong ví dụ sau, thuộc tính onclick
(có mã), được thêm vào phần tử <button>
:
Ví dụ
<button onclick="document.getElementById('demo').innerHTML = Date()">The time is?</button>
Hãy tự mình thử »Trong ví dụ trên, mã JavaScript thay đổi nội dung của phần tử bằng id="demo".
Trong ví dụ tiếp theo, mã thay đổi nội dung của phần tử riêng của nó (sử dụng this .innerHTML
):
Mã JavaScript thường dài vài dòng. Thông thường hơn là thấy các hàm gọi thuộc tính sự kiện:
Các sự kiện HTML phổ biến
Dưới đây là danh sách một số sự kiện HTML phổ biến:
Sự kiện | Sự miêu tả |
---|---|
trao đổi | Một phần tử HTML đã được thay đổi |
trong một cái nhấp chuột | Người dùng nhấp vào một phần tử HTML |
di chuột qua | Người dùng di chuyển chuột qua phần tử HTML |
onmouseout | Người dùng di chuyển chuột ra khỏi phần tử HTML |
onkeydown | Người dùng nhấn một phím trên bàn phím |
đang tải | Trình duyệt đã tải trang xong |
Danh sách này dài hơn nhiều: Các sự kiện DOM HTML tham chiếu JavaScript của W3Schools .
Trình xử lý sự kiện JavaScript
Trình xử lý sự kiện có thể được sử dụng để xử lý và xác minh dữ liệu nhập của người dùng, hành động của người dùng và hành động của trình duyệt:
- Những việc nên làm mỗi khi tải trang
- Những việc nên làm khi đóng trang
- Hành động cần được thực hiện khi người dùng nhấp vào nút
- Nội dung cần được xác minh khi người dùng nhập dữ liệu
- Và hơn thế nữa ...
Nhiều phương pháp khác nhau có thể được sử dụng để JavaScript hoạt động với các sự kiện:
- Thuộc tính sự kiện HTML có thể thực thi mã JavaScript trực tiếp
- Thuộc tính sự kiện HTML có thể gọi các hàm JavaScript
- Bạn có thể gán các hàm xử lý sự kiện của riêng mình cho các phần tử HTML
- Bạn có thể ngăn các sự kiện được gửi hoặc xử lý
- Và hơn thế nữa ...
Bạn sẽ tìm hiểu thêm nhiều điều về sự kiện và trình xử lý sự kiện trong các chương HTML DOM.