Thuộc tính sự kiện HTML

Hà Nguyễn

HTML có khả năng cho phép các sự kiện kích hoạt những hành động trong trình duyệt, như khởi động JavaScript khi người dùng nhấp vào một phần tử.

Để tìm hiểu thêm về các sự kiện lập trình, vui lòng truy cập hướng dẫn JavaScript của Quantrimang.com.

Dưới đây là các thuộc tính sự kiện có thể được thêm vào những phần tử HTML để xác định các hành động sự kiện.

Thuộc tính sự kiện cửa sổ

Các sự kiện được kích hoạt cho đối tượng cửa sổ (áp dụng cho thẻ <body>):

Thuốc tính	Giá trị	Mô tả
onafterprint	script	Script được chạy sau khi tài liệu được in
onbeforeprint	script	Script được chạy trước khi tài liệu được in
onbeforeunload	script	Script được chạy khi tài liệu sắp bị gỡ bỏ
onerror	script	Script được chạy khi xảy ra lỗi
onhashchange	script	Script được chạy khi có những thay đổi đối với phần anchor của URL
onload	script	Bắt đầu sau khi load xong trang
onmessage	script	Script được chạy khi thông báo được kích hoạt
onoffline	script	Script được chạy khi trình duyệt bắt đầu hoạt động ngoại tuyến
ononline	script	Script được chạy khi trình duyệt bắt đầu hoạt động trực tuyến
onpagehide	script	Script được chạy khi người dùng điều hướng khỏi một trang
onpageshow	script	Script được chạy khi người dùng điều hướng đến một trang
onpopstate	script	Script được chạy khi lịch sử của cửa sổ thay đổi
onresize	script	Kích hoạt khi cửa sổ trình duyệt được thay đổi kích thước
onstorage	script	Script được chạy khi khu vực Web Storage được cập nhật
onunload	script	Kích hoạt khi một trang đã được loại bỏ (hoặc cửa sổ trình duyệt đã bị đóng)

Sự kiện biểu mẫu

Các sự kiện được kích hoạt bởi các hành động bên trong biểu mẫu HTML (áp dụng cho hầu hết mọi phần tử HTML, nhưng được sử dụng nhiều nhất trong những phần tử biểu mẫu):

Thuộc tính	Giá trị	Mô tả
onblur	script	Kích hoạt thời điểm mà phần tử bị mất tiêu điểm
onchange	script	Kích hoạt thời điểm khi giá trị của phần tử được thay đổi
oncontextmenu	script	Script được chạy khi menu ngữ cảnh được kích hoạt
onfocus	script	Kích hoạt thời điểm khi phần tử được chọn
oninput	script	Script được chạy khi một phần tử được người dùng nhập vào
oninvalid	script	Script được chạy khi một phần tử không hợp lệ
onreset	script	Kích hoạt khi nút Reset trong biểu mẫu được nhấp vào
onsearch	script	Kích hoạt khi người dùng viết nội dung nào đó trong trường tìm kiếm (đối với <input="search">)
onselect	script	Kích hoạt sau khi một số văn bản đã được chọn trong một phần tử
onsubmit	script	Kích hoạt khi biểu mẫu được gửi

Sự kiện bàn phím

Thuộc tính	Giá trị	Mô tả
onkeydown	script	Kích hoạt khi người dùng đang nhấ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ả phím

Sự kiện chuột

Thuộc tính	Giá trị	Mô tả
onclick	script	Kích hoạt khi nhấp chuột vào phần tử
ondblclick	script	Kích hoạt khi nhấp đúp vào phần tử
onmousedown	script	Kích hoạt khi nhấn nút chuột trên một phần tử
onmousemove	script	Kích hoạt khi con trỏ chuột đang di chuyển trong khi nó ở trên một phần tử
onmouseout	script	Kích hoạt khi con trỏ chuột di chuyển ra khỏi một phần tử
onmouseover	script	Kích hoạt khi con trỏ chuột di chuyển qua một phần tử
onmouseup	script	Kích hoạt khi nút chuột được nhả trên một phần tử
onmousewheel	script	Không được chấp nhận. Sử dụng thuộc tính onwheel để thay thế
onwheel	script	Kích hoạt khi con lăn chuột cuộn lên hoặc xuống trên một phần tử

Sự kiện kéo

Thuộc tính	Giá trị	Mô tả
ondrag	script	Script được chạy khi một phần tử được kéo
ondragend	script	Script được chạy khi kết thúc thao tác kéo
ondragenter	script	Script được chạy khi một phần tử đã được kéo đến một mục tiêu thả hợp lệ
ondragleave	script	Script được chạy khi một phần tử rời khỏi mục tiêu thả hợp lệ
ondragover	script	Script được chạy khi một phần tử đang được kéo qua một mục tiêu thả hợp lệ
ondragstart	script	Script được chạy khi bắt đầu thao tác kéo
ondrop	script	Script được chạy khi phần tử kéo đang được thả
onscroll	script	Script được chạy khi thanh cuộn của một phần tử đang được cuộn

Sự kiện clipboard

Thuộc tính	Giá trị	Mô tả
oncopy	script	Kích hoạt khi người dùng sao chép nội dung của một phần tử
oncut	script	Kích hoạt khi người dùng cắt nội dung của một phần tử
onpaste	script	Kích hoạt khi người dùng dán một số nội dung vào một phần tử

Sự kiện media

Các sự kiện được kích hoạt bởi nội dung media như video, hình ảnh và âm thanh (áp dụng cho tất cả các phần tử HTML, nhưng phổ biến nhất trong các phần tử media, như <audio>, <embed>, <img>, <object> và <video>).

Thuộc tính	Giá trị	Mô tả
onabort	script	Script được chạy khi hủy bỏ
oncanplay	script	Script được chạy khi file đã sẵn sàng để bắt đầu phát (khi file đã đủ bộ đệm để bắt đầu)
oncanplaythrough	script	Script được chạy khi một file có thể được phát đến cuối mà không tạm dừng để lưu vào bộ đệm
oncuechange	script	Script được chạy khi cue thay đổi trong phần tử `<track>`
ondurationchange	script	Script được chạy khi độ dài của media thay đổi
onemptied	script	Script được chạy khi có điều gì đó xấu xảy ra và file đột ngột không khả dụng (như ngắt kết nối bất ngờ)
onended	script	Script được chạy khi nội dung media đã phát đến phần cuối (một sự kiện hữu ích cho các thông điệp như "cảm ơn đã lắng nghe")
onerror	script	Script được chạy khi xảy ra lỗi khi file đang load
onloadeddata	script	Script được chạy khi dữ liệu media được tải
onloadedmetadata	script	Script được chạy khi dữ liệu meta (như kích thước và thời lượng) được load
onloadstart	script	Script được chạy ngay khi file bắt đầu load trước khi mọi thứ thực sự được load
onpause	script	Script được chạy khi media bị người dùng tạm dừng hoặc theo chương trình
onplay	script	Script được chạy khi media đã sẵn sàng để bắt đầu phát
onplaying	script	Script được chạy khi media thực sự đã bắt đầu phát
onprogress	script	Script được chạy khi trình duyệt đang trong quá trình lấy dữ liệu media
onratechange	script	Script được chạy mỗi khi tốc độ phát thay đổi (như khi người dùng chuyển sang chế độ chuyển động chậm hoặc tua nhanh)
onseeked	script	Script được chạy khi thuộc tính seeking được đặt thành false cho biết rằng việc tìm kiếm đã kết thúc
onseeking	script	Script được chạy khi thuộc tính seeking được đặt thành true cho biết rằng tìm kiếm đang hoạt động
onstalled	script	Script được chạy khi trình duyệt không thể tìm nạp dữ liệu media vì bất kỳ lý do gì
onsuspend	script	Script được chạy khi quá trình tìm nạp dữ liệu media bị dừng trước khi nó được load hoàn toàn vì bất kỳ lý do gì
ontimeupdate	script	Script được chạy khi vị trí phát đã thay đổi (như khi người dùng chuyển tiếp nhanh đến một điểm khác trên media)
onvolumechange	script	Script được chạy mỗi khi thay đổi âm lượng (bao gồm cả việc đặt âm lượng thành "mute")
onwaiting	script	Script được chạy khi nội dung media đã tạm dừng nhưng dự kiến sẽ tiếp tục (như khi nội dung media tạm dừng để đệm thêm dữ liệu)