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