Các sự kiện trong JavaScript

Sự kiện HTML là “sự kiện” 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ể “tác động trở lại” với những sự kiện này.

Sự kiện HTML

Một sự kiện HTML có thể là một cái gì đó 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ề sự kiện HTML:

• Một trang HTML đã tải xong
• Trường đầu vào HTML đã được thay đổi
• Một nút HTML đã được nhấp

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 dòng lệnh khi sự kiện được thực thi.

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.

Với dấu nháy đơn:

<element event=‘some JavaScript‘>

Với dấu nháy kép:

<element event=“some JavaScript“>

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

<button onclick=”document.getElementById(‘demo’).innerHTML = Date()”>The time is?</button>

Trong ví dụ trên, mã JavaScript sẽ thay đổi nội dung của phần tử với id = “demo”. Trong ví dụ tiếp theo, mã sẽ thay đổi nội dung của phần tử riêng của nó (sử dụng this.innerHTML):

<button onclick=”this.innerHTML = Date()”>The time is?</button>

Mã JavaScript thường dài một vài dòng. Nó phổ biến hơn để xem các thuộc tính sự kiện gọi các hàm.

Ví dụ:

<button onclick=”displayDate()”>The time is?</button>

Sự kiện HTML chung

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

Ứng dụng trong JavaScript

Trình xử lý sự kiện có thể được sử dụng để xử lý, và xác minh, 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 điều cần làm mỗi khi tải trang
• Những điều cần làm khi đóng trang
• Hành động cần được thực hiện khi người dùng nhấp vào một nút
• Nội dung cần được xác minh khi người dùng nhập dữ liệu
• …..

Có thể sử dụng nhiều phương pháp khác nhau để làm việc 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
• Thuộc tính sự kiện HTML có thể gọi hàm JavaScript
• Bạn có thể gán các hàm xử lý sự kiện của riêng bạn cho các phần tử HTML
• Bạn có thể ngăn sự kiện được gửi đi hoặc bị xử lý
• ……….