Bài 20 sự kiện trong javascript

 



LAB 7: JAVASCRIPT

SỰ KIỆN TRONG JAVASCRIPT

 

A – LÝ THUYẾT

I – TÌM HIỂU SỰ KIỆN TRONG JAVASCRIPT

1 – Khái niệm

2 – Các hình thái của sự kiện

  • Nhấn chuột
  • Tải một trang web hoặc một hình ảnh
  • Di chuyển chuột qua một vị trí nào đó của trang web
  • Lựa chọn một ô nhập liệu trong HTML form
  • Gửi một dữ liệu từ HTML
  • Nhấn một tổ hợp phím

 

I – CÁC SỰ KIỆN VỚI LINK VÀ HÌNH ẢNH

1 – Sự kiện Oclick

2 – Sự kiện OnMouseOver

3 – Sự Kiện OnMouseOut

 

III – SỰ KIỆN VỚI DOCUMENT

1 – Sự kiện onLoad

2 – Sự Kiện onUnload

 

IV – SỰ KIỆN VỚI FORM VÀ CÁC PHẦN TỬ TRONG FORM

1 – Đối tượng Form và các sự kiện của nó

A – Sự kiện onSubmit

B – Sự kiện onReset

2 – Phần tử TextBox, TextArea, SelectBox và các sự kiện của nó

A – Sự kiện onBlur

B – Sự kiện onChange

C – Sự kiện onFocus

 

3 – Phần tử CheckBox, Radio Button, Button, Reset Button và các sự kiện của nó

A – Sự kiện onClick

 

B – THỰC HÀNH

<html>

<head><title>html17</title></head>

<script language="javascript">

function eventFunction(){

alert('ok');

}

</script>

<body >

<a href="#"  onclick="eventFunction();" onmouseover="eventFunction();">Link</a>

<img src="doanhnghiep.gif"/>

<br><br>

<form onsubmit="eventFunction();" onreset="eventFunction();">

<input type="text"  onblur="eventFunction();"/>

<br>

<textarea  onblur="eventFunction();"></textarea>

<br>

<select>

<option>item 01 </option>

<option>item 02 </option>

<option>item 03 </option>

<option>item 04 </option>

</select>

<input type="submit" name="sumit_name" value="Submit" />

<input type="reset" name="sumit_name" value="Clear" />

</form>

</body>

</html>

I – BÀI TẬP THỰC HÀNH

 

<html>

<head> <title> Bai 17 </title>


<script language="JavaScript"> 

function writeIt(value) 

{ myfm.out.value=value; } 

</script>

 </head> 

 <body>

 <center>

 <form name="myfm">

 <textarea cols="40" rows="10" name="in" >input</textarea><br>

 <input type="button" value="Hiển thị" onClick="writeIt(myfm.in.value);"> <br>

 <textarea cols="40" rows="10" name="out" >output</textarea><br>

 </form>

 </center>

 </body>

 </html>


>>Xem bài trước: Bài 19 Hàm trong javascript


>>Xem bài tiếp theo: Bài 21 form trong javascript


No comments:

Post a Comment