Hướng dẫn what are different types of events in javascript? - các loại sự kiện khác nhau trong javascript là gì?


Các sự kiện HTML là "những thứ" xảy ra với các yếu tố HTML."things" that happen to HTML elements.

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. "react" on these events.


Sự kiện HTML

Một sự kiện HTML có thể là điều mà trình duyệt thực hiện hoặc một cái gì đó mà 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
  • 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 phát hiện các sự kiện.

HTML cho phép các thuộc tính xử lý sự kiện, với mã JavaScript, được thêm vào các phần tử HTML.with JavaScript code, to be added to HTML elements.

Với các trích dẫn đơn:

'some JavaScript'>

Với dấu ngoặc kép:

"some JavaScript">

Với dấu ngoặc kép:

Trong ví dụ sau, thuộc tính onclick (có mã), được thêm vào phần tử <button>:

Thí dụ

Thời gian là?

Hãy tự mình thử »

Trong ví dụ trên, mã JavaScript thay đổi nội dung của phần tử với id = "demo".

Trong ví dụ sau, thuộc tính onclick (có mã), được thêm vào phần tử <button>:

Thí dụ

Thời gian là?

Hãy tự mình thử »



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):

Mã JavaScript thường dài vài dòng. Nó là phổ biến hơn để xem các thuộc tính sự kiện gọi các chức năng: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:Biến cố
Sự mô tảonchange
Một phần tử HTML đã được thay đổitrong một cái nhấp chuột
Người dùng nhấp vào phần tử HTMLonmouseOver
Người dùng di chuyển chuột qua phần tử HTMLonmouseOut
Người dùng di chuyển chuột ra khỏi phần tử HTMLOnkeydown

Người dùng nhấn phím bàn phím


đang tải

Trình duyệt đã hoàn thành tải trang

  • Danh sách dài hơn nhiều: W3Schools tham khảo JavaScript HTML DOM.
  • 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 đầu vào của người dùng, hành động của người dùng và các hành động trình duyệt:
  • Những việc nên được thực hiện mỗi khi một trang tải
  • Những việc nên được thực hiện khi trang được đóng

Hành động nê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à 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
  • Những việc nên được thực hiện khi trang được đóng

Hành động nê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

Exercise:

Và nhiều hơn nữa ...

<button ="alert('Hello')">Click me.</button>

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:



Loại sự kiệnSự mô tảTài liệu
Hoạt hình

Các sự kiện liên quan đến API hoạt hình web.

Được sử dụng để đáp ứng với các thay đổi về trạng thái hoạt hình (ví dụ: khi hoạt hình bắt đầu hoặc kết thúc).

Các sự kiện hoạt hình được bắn vào Document, Window, HTMLElement.
Dữ liệu không đồng bộ tìm nạp

Các sự kiện liên quan đến dữ liệu tìm nạp.

Các sự kiện được bắn vào AbortSignal, XMLHttpRequest, onclick0.
Bảng tạm

Các sự kiện liên quan đến API clipboard.

Được sử dụng để thông báo khi nội dung được cắt, sao chép hoặc dán.

Các sự kiện được bắn vào Document, onclick2, Window.
Thành phần

Các sự kiện liên quan đến thành phần; Nhập văn bản "gián tiếp" (thay vì sử dụng nhấn bàn phím bình thường).

Ví dụ: văn bản được nhập thông qua bài phát biểu đến công cụ văn bản hoặc sử dụng các kết hợp khóa đặc biệt để sửa đổi bàn phím để biểu diễn các ký tự mới bằng ngôn ngữ khác.

Các sự kiện được bắn vào onclick2.
Chuyển đổi CSS

Các sự kiện liên quan đến chuyển đổi CSS.

Cung cấp các sự kiện thông báo khi chuyển đổi CSS bắt đầu, dừng lại, bị hủy, v.v.

Các sự kiện được bắn vào Document, HTMLElement, Window.
Cơ sở dữ liệu

Các sự kiện liên quan đến hoạt động cơ sở dữ liệu: mở, đóng, giao dịch, lỗi, v.v.

Các sự kiện được bắn vào onclick8, onclick9, <button>0, <button>1.
Đột biến dom

Các sự kiện liên quan đến sửa đổi phân cấp và các nút mô hình đối tượng tài liệu (DOM).

CẢNH BÁO: Các sự kiện đột biến không được chấp nhận. Các nhà quan sát đột biến nên được sử dụng thay thế. Mutation Events are deprecated. Mutation Observers should be used instead.

Kéo'n'drop, bánh xe

Các sự kiện liên quan đến việc sử dụng các sự kiện API kéo và thả API và bánh xe HTML.

Các sự kiện kéo và bánh xe có nguồn gốc từ các sự kiện chuột. Mặc dù chúng được bắn khi sử dụng bánh xe chuột hoặc kéo/thả, chúng cũng có thể được sử dụng với phần cứng thích hợp khác.

Kéo các sự kiện được bắn vào Document

Các sự kiện bánh xe được bắn vào Documentonclick2

Tiêu điểm

Các sự kiện liên quan đến các yếu tố đạt được và mất tập trung.

Các sự kiện được bắn vào onclick2, Window.
Hình thức

Các sự kiện liên quan đến các hình thức được xây dựng, đặt lại và gửi.

Các sự kiện được bắn vào <button>7.
Toàn màn hình

Các sự kiện liên quan đến API toàn màn hình.

Được sử dụng để thông báo khi chuyển đổi giữa các chế độ toàn màn hình và cửa sổ và cả các lỗi xảy ra trong quá trình chuyển đổi này.

Các sự kiện được bắn vào Document, onclick2.
Gamepad

Các sự kiện liên quan đến API GamePad.

Các sự kiện được bắn vào Window.
Cử chỉ

Các sự kiện cảm ứng được khuyến nghị để thực hiện cử chỉ.

Các sự kiện được bắn vào Document, onclick2.

Gamepad

  • Các sự kiện liên quan đến API GamePad.
  • Các sự kiện được bắn vào Window.
Cử chỉ

Các sự kiện cảm ứng được khuyến nghị để thực hiện cử chỉ.

Các sự kiện được bắn vào Window.
Cử chỉ

Các sự kiện cảm ứng được khuyến nghị để thực hiện cử chỉ.

Ngoài ra, có một số sự kiện cử chỉ không chuẩn:
Các sự kiện cụ thể của WebKit không chuẩn trên sự kiện onclick2: this.innerHTML4, sự kiện this.innerHTML5, sự kiện this.innerHTML6.

Các sự kiện cụ thể IE không chuẩn trên onclick2: this.innerHTML8, this.innerHTML9, <button>0, <button>1, <button>2.

Lịch sử
Các sự kiện liên quan đến API lịch sử.

Quản lý hiển thị nội dung phần tử HTML

Các sự kiện liên quan đến việc thay đổi trạng thái của một phần tử hiển thị hoặc văn bản.

Các sự kiện được bắn vào Document, onclick2.
Gamepad

Các sự kiện liên quan đến API GamePad.

Các sự kiện được bắn vào Window.

Cử chỉ

Các sự kiện cảm ứng được khuyến nghị để thực hiện cử chỉ.

Các sự kiện được bắn vào Window.
Cử chỉ

Các sự kiện cảm ứng được khuyến nghị để thực hiện cử chỉ.

Các sự kiện được bắn vào Document7, Document8, Document9, Window0, Window1, Window2, Window3, Window4, Window5, Window6, Window7, Window8, phần tử/phần tử, phần tử/video.
Nhắn tin

Các sự kiện liên quan đến một cửa sổ nhận được một tin nhắn từ bối cảnh duyệt khác.

Các sự kiện được bắn vào Window.
Con chuột

Các sự kiện liên quan đến việc sử dụng chuột máy tính.

Được sử dụng để thông báo khi chuột được nhấp, do đôi, lên và xuống các sự kiện, nhấp chuột phải, chuyển động trong và ra khỏi một yếu tố, lựa chọn văn bản, v.v.

Các sự kiện con trỏ cung cấp một sự thay thế bất khả tri về phần cứng cho các sự kiện của chuột. Các sự kiện kéo và bánh xe có nguồn gốc từ các sự kiện chuột.

Các sự kiện chuột bị bắn vào onclick2
Kết nối mạng

Các sự kiện liên quan đến việc đạt được và mất kết nối mạng.

Các sự kiện được bắn vào Window.

Con chuột

Các sự kiện liên quan đến việc sử dụng chuột máy tính.

Được sử dụng để thông báo khi chuột được nhấp, do đôi, lên và xuống các sự kiện, nhấp chuột phải, chuyển động trong và ra khỏi một yếu tố, lựa chọn văn bản, v.v.

Các sự kiện con trỏ cung cấp một sự thay thế bất khả tri về phần cứng cho các sự kiện của chuột. Các sự kiện kéo và bánh xe có nguồn gốc từ các sự kiện chuột.

Các sự kiện chuột bị bắn vào onclick2

Kết nối mạng

Các sự kiện liên quan đến việc đạt được và mất kết nối mạng.

Các sự kiện được bắn trên HTMLElement2 (API thông tin mạng).

Thanh toán

Các sự kiện liên quan đến API yêu cầu thanh toán.

Các sự kiện được bắn vào HTMLElement3, HTMLElement4.
Màn biểu diễn

Các sự kiện liên quan đến API thời gian phân giải cao, API thời gian hiệu suất, API thời gian điều hướng, API thời gian người dùng và API thời gian tài nguyên.

Các sự kiện được bắn vào Window.
Con chuột

Các sự kiện liên quan đến việc sử dụng chuột máy tính.

Các sự kiện được bắn vào Window.
Con chuột

Các sự kiện liên quan đến việc sử dụng chuột máy tính.

Được sử dụng để thông báo khi chuột được nhấp, do đôi, lên và xuống các sự kiện, nhấp chuột phải, chuyển động trong và ra khỏi một yếu tố, lựa chọn văn bản, v.v.
Các sự kiện con trỏ cung cấp một sự thay thế bất khả tri về phần cứng cho các sự kiện của chuột. Các sự kiện kéo và bánh xe có nguồn gốc từ các sự kiện chuột.

Các sự kiện chuột bị bắn vào onclick2

Kết nối mạng

Các sự kiện liên quan đến việc đạt được và mất kết nối mạng.

Các sự kiện được bắn trên HTMLElement2 (API thông tin mạng).

Thanh toán

Các sự kiện liên quan đến API yêu cầu thanh toán.

Các sự kiện được bắn vào HTMLElement3, HTMLElement4.

Màn biểu diễn

Các sự kiện liên quan đến API thời gian phân giải cao, API thời gian hiệu suất, API thời gian điều hướng, API thời gian người dùng và API thời gian tài nguyên.
Các sự kiện được bắn vào HTMLElement5.

Con trỏ

Các sự kiện liên quan đến API sự kiện con trỏ. The WebVR API (and associated Window events) are deprecated.

Cung cấp thông báo không liên tục phần cứng từ các thiết bị trỏ bao gồm chuột, cảm ứng, bút/bút stylus.
Các sự kiện được bắn vào Document, HTMLElement.

In

Các sự kiện liên quan đến in ấn.
Lời hứa từ chối

Các sự kiện được gửi đến bối cảnh tập lệnh toàn cầu khi bất kỳ lời hứa JavaScript nào bị từ chối.

ổ cắm
Các sự kiện liên quan đến API WebSockets.

Các sự kiện được bắn vào AbortSignal0.

SVG
Các sự kiện liên quan đến hình ảnh SVG.

Các sự kiện được bắn vào AbortSignal1, AbortSignal2, AbortSignal3.

Lựa chọn văn bản

Lựa chọn các sự kiện API liên quan đến việc chọn văn bản.

Có bao nhiêu sự kiện trong JavaScript?

Các sự kiện HTML 5 tiêu chuẩn được liệt kê ở đây để bạn tham khảo.Ở đây tập lệnh cho biết hàm javascript sẽ được thực thi chống lại sự kiện đó.... HTML 5 Sự kiện tiêu chuẩn ..

Sự kiện trong JavaScript giải thích bất kỳ năm loại xử lý sự kiện khác nhau là gì?

Kịch bản xử lý sự kiện.

Các loại sự kiện tải khác nhau là gì?

Tóm tắt: Trong hướng dẫn này, bạn sẽ tìm hiểu về các sự kiện có liên quan đến tải trang bao gồm DomContentLoaded, Load, Beforeunload và dỡ hàng.DOMContentLoaded , load , beforeunload , and unload .

Loại sự kiện là gì?

Loại sự kiện là cấu trúc dữ liệu xác định dữ liệu có trong một sự kiện.Khi dữ liệu sự kiện RAW vào ứng dụng xử lý sự kiện Oracle, ứng dụng sẽ liên kết dữ liệu đó với một sự kiện thuộc loại sự kiện cụ thể.a data structure that defines the data contained in an event. When raw event data comes into the Oracle Event Processing application, the application binds that data to an event of a particular event type.