Sự kiện trong HTML
HTML 4 đã bổ sung thêm tính năng bắt các sự kiện (event) khi người dùng thao thác trên trình duyệt, VD: chạy một mã JavaScript khi người dùng nhấn vào một thành phần nào đó. Để tìm hiểu thêm về lập trình với các sự kiện, bạn có thể tham khảo phần học JavaScript. Dưới đây là những sự kiện bạn có ...
HTML 4 đã bổ sung thêm tính năng bắt các sự kiện (event) khi người dùng thao thác trên trình duyệt, VD: chạy một mã JavaScript khi người dùng nhấn vào một thành phần nào đó.
Để tìm hiểu thêm về lập trình với các sự kiện, bạn có thể tham khảo phần học JavaScript.
Dưới đây là những sự kiện bạn có thể thêm vào trong các thẻ của HTML và đưa ra hành động tương ứng với các sự kiện đó.
= Thuộc tính sự kiện cho HTML5.
Sự kiện cho cửa sổ trình duyệt
Sự kiện được kích hoạt khi người dung tương tác với cửa sổ trình duyệt (Dùng trong thẻ <body>)
Sự kiện | Giá trị | Miêu tả | |
---|---|---|---|
onafterprint | script | Chạy script sau khi in trang | |
onbeforeprint | script | Chạy script trước khi in trang | |
onbeforeunload | script | Chạy script trước khi người dùng thoát trang | |
onerror | script | Chạy script khi xảy ra lỗi | |
onhashchange | script | Chạy script khi người dùng thay đổi một phần địa chỉ trang (hash) | |
onload | script | Chạy script sau khi trang được tải xong | |
onmessage | script | Chạy script khi có một message được chuyển tới | |
onoffline | script | Chạy script khi trình duyệt bắt đầu chế độ làm việc Offline | |
ononline | script | Chạy script khi trình duyệt bắt đầu chế độ làm việc Online | |
onpagehide | script | Chạy script khi người dùng duyệt trang khác | |
onpageshow | script | Chạy script khi người dùng duyệt trang | |
onpopstate | script | Chạy script khi thay đổi lịch sử các trang đã xem | |
onresize | script | Chạy script khi kích thước trình duyệt thay đổi | |
onstorage | script | Chạy script khi cơ sở dữ liệu của trình duyệt được cập nhật | |
onunload | script | Chạy script khi người dùng tải trang khác (hoặc đóng cửa sổ trình duyệt) |
Sự kiện cho Form
Được kích hoạt khi người dùng thao tác trên một form HTML (những sự kiện này dùng được cho hầu hết các thẻ trong HTML nhưng chủ yếu được dùng trong form):
Sự kiện | Giá trị | Miêu tả | |
---|---|---|---|
onblur | script | Kích hoạt ngay khi khi người dùng chuyển con trỏ ra ngoài | |
onchange | script | Kích hoạt ngay khi giá trị trong thẻ thay đổi | |
oncontextmenu | script | Chạy script khi menu tự tạo được kích hoạt | |
onfocus | script | Kích hoạt ngay khi người dùng chuyển con trỏ vào thẻ | |
oninput | script | Chạy script khi người dùng nhập liệu | |
oninvalid | script | Chạy script khi nội dung không hợp lệ | |
onreset | script | Kích hoạt khi người dùng nhấn vào nút Reset trên form | |
onsearch | script | Kích hoạt khi người dùng nhập liệu trên khung tìm kiếm (dùng cho <input="search">) |
|
onselect | script | Kích hoạt sau khi người dùng bôi đen nội dung trong thẻ | |
onsubmit | script | Kích hoạt khi dữ liệu từ form được gửi đi |
Sự kiện khi thao tác với bàn phím
Sự kiện | Giá trị | Miêu tả |
---|---|---|
onkeydown | script | Kích hoạt ngay khi người dùng nhấn xuống một nút trên bàn phím |
onkeypress | script | Kích hoạt khi người dùng nhấn một phím |
onkeyup | script | Kích hoạt khi người dùng nhấn xong một nút trên bàn phím |
Sự kiện khi thao tác với chuột
Sự kiện được kích hoạt khi người dùng sử dụng chuột hoặc dùng thao tác tương tự:
Sự kiện | Giá trị | Miêu tả | |
---|---|---|---|
onclick | script | Kích hoạt khi người dùng nhấn chuột vào một thẻ | |
ondblclick | script | Kích hoạt khi người dùng nhấn đúp chuột vào một thẻ | |
ondrag | script | Chạy một script khi người dùng kéo một thẻ | |
ondragend | script | Chạy script khi người dùng thả thẻ | |
ondragenter | script | Chạy script khi người dùng kéo nội dung vào một thẻ hợp lệ | |
ondragleave | script | Chạy script khi người dùng kéo nội dung ra khỏi một thẻ hợp lệ | |
ondragover | script | Chạy script khi người dùng kéo nội dung trên một thẻ hợp lệ | |
ondragstart | script | Chạy script khi người dùng bắt đầu thao tác kéo | |
ondrop | script | Chạy script khi một nội dung được thả vào | |
onmousedown | script | Kích hoạt khi người dùng nhấn chuột xuống thẻ | |
onmousemove | script | Kích hoạt khi người dùng di chuột trên một thẻ | |
onmouseout | script | Kích hoạt khi người dùng di chuột ra khỏi thẻ | |
onmouseover | script | Kích hoạt khi người dùng di chuột trên thẻ | |
onmouseup | script | Kích hoạt khi người dùng thả phím khỏi chuột | |
onmousewheel | script | Sự kiện này đã bị bỏ. Được thay thế bằng sự kiện onwheel | |
onscroll | script | Chạy script khi thanh cuốn trên thẻ được kéo | |
onwheel | script | Kích hoạt khi cuộn chuột lên hoặc xuống (bằng con lăn trên chuột) |
Sự kiện cho Clipboard
Sự kiện | Giá trị | Miêu tả |
---|---|---|
oncopy | script | Kích hoạt khi người dùng sao chép nội dung trên thẻ |
oncut | script | Kích hoạt khi người dùng cắt một nội dung trên thẻ |
onpaste | script | Kích hoạt khi người dùng dán nội dung vào thẻ |
Sự kiện cho Media
Sự kiện được sử dụng trên các thẻ về video, ảnh và audio (dùng được trên hầu hết các thẻ của HTML nhưng chủ yếu sử dụng trên các thẻ media như <audio>, <embed>, <img>, <object> và <video>).
Chú giải về “seeking” : Đây là một thuật ngữ để chỉ hành động bạn chuyển tới một giây nào đó trong khi xem video hay nghe nhạc. VD: Bạn đang xem phim ở phút thứ 6 bạn chuyển tới phút thứ 10 để xem => Hành động chuyển tới phút 10 đó là seeking