常見的事件如下: 事件 事件句柄 用法 blur onblur 元素失去焦點。 focus onfocus 元素獲得焦點。
change onchange 域的內容被改變。
click onclick 當用戶點擊某個對象時調用的事件句柄。 dblclick ondblclick 當用戶雙擊某個對象時調用的事件句柄。
keydown onkeydown 某個鍵盤按鍵被按下。 keyup onkeyup 某個鍵盤按鍵被松開。
load onload 一張頁面或一幅圖像完成加載。
mousedown onmousedown 鼠標按鈕被按下。 mousemove onmousemove 鼠標被移動。 mouseout onmouseout 鼠標從某元素移開。 mouseover onmouseover 鼠標移到某元素之上。 mouseup onmouseup 鼠標按鍵被松開。
reset onreset 重置按鈕被點擊。 submit onsubmit 確認按鈕被點擊。
select onselect 文本被選中。
1 <!doctype html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <meta name="Generator" content="EditPlus®"> 6 <meta name="Author" content=""> 7 <meta name="Keywords" content=""> 8 <meta name="Description" content=""> 9 <title>事件</title> 10 </head> 11 <body onload="alert('hello everybody')"> 12 <script type="text/javascript"> 13 /* 14 1.javaScript是一種基於時間驅動型的編程語言: 15 1.1事件和事件句柄的關系:click,onclick 16 1.2事件句柄通常是某個標簽的屬性<input type="button" value="button" onclick=""> 17 1.3事件發生之后,代碼才會執行,事件不發生,不會執行JS代碼 18 1.4常見的事件如下: 19 事件 事件句柄 用法 20 blur onblur 元素失去焦點。 21 focus onfocus 元素獲得焦點。 22 23 change onchange 域的內容被改變。 24 25 click onclick 當用戶點擊某個對象時調用的事件句柄。 26 dblclick ondblclick 當用戶雙擊某個對象時調用的事件句柄。 27 28 keydown onkeydown 某個鍵盤按鍵被按下。 29 keyup onkeyup 某個鍵盤按鍵被松開。 30 31 load onload 一張頁面或一幅圖像完成加載。 32 33 mousedown onmousedown 鼠標按鈕被按下。 34 mousemove onmousemove 鼠標被移動。 35 mouseout onmouseout 鼠標從某元素移開。 36 mouseover onmouseover 鼠標移到某元素之上。 37 mouseup onmouseup 鼠標按鍵被松開。 38 39 reset onreset 重置按鈕被點擊。 40 submit onsubmit 確認按鈕被點擊。 41 42 select onselect 文本被選中。 43 */ 44 </script> 45 blur/focus:<input type="text" onblur="alert(this.value)" onfocus="this.value=''"/><br> 46 47 change: 48 <select onchange="alert(this.value)"> 49 <option value="">-請選擇省份-</option> 50 <option value="001">河北省</option> 51 <option value="002">河南省</option> 52 <option value="003">湖南省</option> 53 </select><br> 54 55 click/dblclick 56 <input type="button" value="單擊" onclick="alert(1)"> 57 <input type="button" value="雙擊" ondblclick="alert(2)"><br> 58 59 keydown/keyup:<input type="text" onkeydown="alert('a')"onkeyup="alert('b')"><br> 60 61 mouseout/mouseover: 62 <div style="border:1px solid red;width:200px;height:200px;position:absolute;top:300px;left:300px;" onmouseout="alert('您已進入雷區')" onmouseover="alert('您已安全')">雷區</div> 63 64 </body> 65 </html>
