Sự kiện của JavaScript

Sự kiện HTML là những "sự kiện" xảy ra trên phần tử HTML.

Khi sử dụng JavaScript trong trang HTML, JavaScript có thể "phản hồi" lại những sự kiện này.

Sự kiện HTML

Sự kiện HTML có thể là những gì trình duyệt hoặc người dùng làm.

Dưới đây là một số ví dụ về sự kiện HTML:

  • Trang web HTML hoàn thành việc tải
  • Champs HTML được thay đổi
  • Nút HTML được nhấn

Thường thì, khi sự kiện xảy ra, người dùng sẽ muốn làm điều gì đó.

JavaScript cho phép bạn thực hiện mã khi sự kiện được phát hiện.

Thông qua mã JavaScript，HTML cho phép bạn thêm trình xử lý sự kiện vào phần tử HTML.

Sử dụng dấu ngoặc đơn:

<element event='Một số JavaScript>

Sử dụng dấu ngoặc kép:

<element event="Một số JavaScript">

Trong ví dụ tiếp theo:onclick Thuộc tính (và mã) được thêm vào <button> Phần tử:

Mô hình

<button onclick='document.getElementById("demo").innerHTML=Date()'>Thời gian hiện tại là gì?</button>

Hãy thử trực tiếp

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

Trong ví dụ tiếp theo, mã (sử dụng this.innerHTML）đã thay đổi nội dung của phần tử của nó:

Mô hình

<button onclick="this.innerHTML=Date()">Thời gian hiện tại là gì?</button>

Hãy thử trực tiếp

Mã JavaScript thường có rất nhiều dòng. Thường gặp hơn là sự gọi hàm thông qua thuộc tính sự kiện:

Mô hình

<button onclick="displayDate()">Thời gian hiện tại là gì?</button>

Hãy thử trực tiếp

Sự kiện HTML phổ biến

Dưới đây là một số sự kiện HTML phổ biến:

sự kiện mô tả
onchange HTML phần tử đã được thay đổi
onclick Người dùng nhấn vào phần tử HTML
onmouseover Người dùng di chuyển con trỏ vào phần tử HTML
onmouseout Người dùng di chuyển con trỏ ra khỏi phần tử HTML
onkeydown Người dùng nhấn phím trên bàn phím
onload Trình duyệt đã hoàn thành việc tải trang

Danh sách đầy đủ hơn:CodeW3C.com JavaScript Tham khảo HTML DOM Sự kiện.

JavaScript có thể làm gì?

Bộ xử lý sự kiện có thể được sử dụng để xử lý, kiểm tra đầu vào người dùng, hành động người dùng và hành động trình duyệt:

  • Việc cần làm khi trang được tải
  • Việc cần làm khi trang được đóng
  • Hành động cần được thực hiện khi người dùng nhấn nút
  • Nội dung cần được kiểm tra khi người dùng nhập dữ liệu
  • v.v.

Có rất nhiều cách để xử lý sự kiện bằng JavaScript:

  • Thuộc tính sự kiện HTML có thể thực thi mã JavaScript
  • Thuộc tính sự kiện HTML có thể gọi hàm JavaScript
  • Bạn có thể gán bộ xử lý sự kiện tùy chỉnh của mình cho các phần tử HTML
  • Bạn có thể ngăn chặn sự kiện được gửi hoặc được xử lý
  • v.v.

Bạn sẽ học thêm về sự kiện và bộ xử lý sự kiện trong phần HTML DOM.