20/07/2019, 10:06

Event in Javascript

Khi làm việc với javascript thì chắc hẳn bạn phải làm quen với sự kiện (event). Vậy sự kiện là gì? Và tác dụng của sự kiện là như thế nào? Về định nghĩa dưới dạng nghe hiểu thì sự kiện là một hành động nào đó tác động lên đối tượng HTML mà ta có thể bắt được sự kiện này và thực hiện những hành ...

Khi làm việc với javascript thì chắc hẳn bạn phải làm quen với sự kiện (event). Vậy sự kiện là gì? Và tác dụng của sự kiện là như thế nào?

Về định nghĩa dưới dạng nghe hiểu thì sự kiện là một hành động nào đó tác động lên đối tượng HTML mà ta có thể bắt được sự kiện này và thực hiện những hành động nào đó.

Xét về mặt thực tế thì ta có dụ thế này: Giả sử bạn xây dựng một form đăng ký tài khoản và bạn muốn bắt sự kiện khi người dùng CLICK vào button đăng ký thì hiện những hành động như validate dữ liệu, thông báo nếu người dùng nhập nội dung không đúng, .. Như vậy bạn cần nhớ rằng mỗi sự kiện chúng ta có thể thực hiện nhiều hành động khác nhau và bao nhiêu hành động thì phụ thuộc vào từng chức năng cụ thể.

Sự kiện chuột (mouse)

Khi sử dụng chuột chúng ta có các thao tác di chuột, click chuột, click đúp chuột, click chuột phải,... Tương ứng với đó trong javascript cũng có các sự kiện sau:

  • onclick: Sự kiện xảy ra khi người dùng click vào phần tử
  • ondblclick: Sự kiện xảy ra khi người dùng double-click vào phần tử
  • oncontextmenu: Sự kiện xảy ra khi người dùng click chuột phải để mở context menu (ấn phím menu trên bàn phím không được nhé)
  • onmousedown: Sự kiện xảy ra khi người dùng ấn một nút chuột trên phần tử (kể cả nút chuột giữa)
  • onmouseup: Sự kiện xảy ra khi người dùng thả nút chuột qua một phần tử

Bạn sẽ hiểu rõ hơn về sự kiện click chuột khi xem ví dụ này. Chú ý: - Khi người dùng click, double-click, right-click thì sẽ xảy ra sự kiện onmousedown, onmouseup và kèm theo các sự kiện tương ứng. - Sự kiện onmousedown, onmouseup sẽ được xảy ra trước onclick, ondblclick, oncontextmenu - Trường hợp người dùng ấn chuột vào phần tử nhưng lại di chuyển chuột ra chỗ khác để thả nút.

0