Javascript - Sự kiện(event)

Khái niệm sự kiện và xử lý sự kiện 

JavaScript là ngôn ngữ định hướng sự kiện, nghĩa là sẽ phản ứng trước các sự kiện như: Click chuột . . . 
Chương trình xử lý sự kiện (Event handler) là 1 đoạn mã hay 1 hàm được thực hiện để phản ứng trước 1 sự kiện được xác định là một thuộc tính của một thẻ HTML:

Cú pháp:

<tagName  eventHandler = "JavaScript Code or Function">

Ví dụ:Trang EventHander.htm thẩm định giá trị đưa vào trong trường text Tuổi phai hợp lệ nếu sẽ xuất hiện thông báo yêu cầu nhập lại. 
 

<HTML>
<HEAD><Title> An Event Handler Exemple </Title>
<Script Language= "JavaScript">
function CheckAge() {
if ( (document.frmDieutra.AGE.value<0)||(document.frmDieutra.AGE.value>120) ) {
alert("Tuổi nhập vào không hợp lệ! Mời bạn nhập  lại");
	document.frmDieutra.AGE.value=0;
	}
}
</Script>
</Head><Body>
<Form NAME="frmDieutra">
Nhập vào tên của bạn:<BR>
Tên <Input Type=Text Name="TEN" ><BR>
Đệm <Input Type=Text Name="DEM" ><BR>
Họ  <Input Type=Text Name="HO" ><BR>
Age <Input Type=Text Name="AGE" onChange="CheckAge()"><BR>
<Input Type="button" Value="Submit">
<Input Type="Reset" Value="Reset">
</Form>
</Body></HTML>

Xem ví dụ

Một số sự kiện trong JavaScript:

Phương thức Giải thích
onBlur Xảy ra khi  input focus bị xoá từ thành phần form
onClick Xảy ra khi người dùng kích vào các thành phần hay liên kết của form.
onChange Xảy ra khi  giá trị của thành phần được chọn thay đổi
onFocus Xảy ra khi thành phần của form được focus(làm nổi lên).
onLoad Xảy ra trang Web được tải.
onMouseOver Xảy ra khi di chuyển chuột qua kết nối hay anchor.
onSelect Xảy ra khi người sử dụng lựa chọn một trường nhập dữ liệu trên form.
onSubmit Xảy ra khi  người dùng đưa ra một form.
onUnLoad Xảy ra khi  người dùng đóng một trang

Các sự kiện có sẵn của một số đối tượng.  

Đối tượng Chương trình xử lý sự kiện có sẵn
Selection list onBlur, onChange, onFocus
Text onBlur, onChange, onFocus, onSelect
Textarea onBlur, onChange, onFocus, onSelect
Button onClick
Checkbox onClick
Radio button onClick
Hypertext link onClick, onMouseOver, onMouseOut
Clickable Imagemap area onMouseOver, onMouseOut
Reset button onClick
Submit button onClick
Document onLoad, onUnload, onError
Window onLoad, onUnload, onBlur, onFocus
Framesets onBlur, onFocus
Form onSubmit, onReset
Image onLoad, onError, onAbort

Ví dụ: Trang LoadUnLoad.htm

<HTML> 
<HEAD> <TITLE>Event Handler</TITLE> 
</HEAD> 
<BODY onLoad="alert('Welcome to my page!');" onUnload="alert('Goodbye! ');"> 
<IMG SRC="Logo.jpg"> 
</BODY> 
</HTML>

Xem ví dụ