JavaScript簡單入門可以看看我醜醜的Github部落格JavaScript簡單入門
本文主要簡單介紹以下幾類事件：
- UI事件
- 焦點事件
- 滑鼠與滾輪事件
- 鍵盤與文字事件
UI事件
UI事件是指那些不一定與使用者操作有關的事件。
load事件
此事件為當頁面完全載入完之後（包括所有的影象、js檔案、css檔案等外部資源），就會觸發window上面的load事件。
有兩種onload事件處理程式的方式。
//第一種
EventUtil.addHandler(window, "load", function(){
alert("load");
});
//第二種
<body onload="alert('load')"></body>影象也可以觸發load事件，無論是在DOM中的影象元素還是HTML中的影象元素。
//第一種
<img src="smile.png" onload="alert('loaded')">
//第二種
var img=document.getElementById("img");
EventUtil.addHandler(img,"load",function(){
event=EventUtil.getEvent(event);
alert(EventUtil.getTarget(event).src);
});unload事件
此事件在文件被完全解除安裝後觸發。使用者從一個頁面切換到另一個頁面就會被觸發。
有兩種定義onunload事件處理程式的方式。
//第一種
EventUtil.addHandler(window, "unload", function(){
alert("load");
});
//第二種
<body onunload="alert('load')"></body>resize事件
當調整瀏覽器的視窗到一個新的寬度或高度時，就會觸發resize事件。這個事件在window（視窗）上面觸發。
EventUtil.addHandler(window, "resize", function(){
alert("resized");
});scroll事件
這個事件會在文件被滾動期間重複被觸發，所以應當儘量保持事件處理程式的程式碼簡單。
//可以通過scrollLeft和scrollTop監控變化
EventUtil.addHandler(window, "scroll", function(){
alert(document.body.scrollTop);
});焦點事件
焦點事件會在頁面元素獲得或失去焦點時觸發。
blur事件
在元素失去焦點時觸發。這個事件不冒泡，所有瀏覽器都支援。
focus事件
在元素獲得焦點時觸發。這個事件不冒泡，所有瀏覽器都支援。
focusin事件
在元素獲得焦點時觸發。這個事件冒泡,某些瀏覽器不支援。
focusout事件
在元素失去焦點時觸發。這個事件冒泡，某些瀏覽器不支援。
注意：即使blur和focus不冒泡，也可以在捕獲階段偵聽到他們。
滑鼠與滾輪事件
click事件
使用者單擊滑鼠左鍵或按下Enter鍵觸發
dbclick事件
使用者雙擊滑鼠左鍵觸發。
mousedown事件
在使用者按下了任意滑鼠按鈕時觸發。
mouseup事件
在使用者釋放滑鼠按鈕時觸發。
mouseenter事件
在滑鼠游標從元素外部首次移動到元素範圍內時觸發。此事件不冒泡。
mouseleave事件
元素上方的游標移動到元素範圍之外時觸發。此事件不冒泡。
mousemove事件
游標在元素的內部不斷的移動時觸發。
mouseover事件
滑鼠指標位於一個元素外部，然後使用者將首次移動到另一個元素邊界之內時觸發。
mouseout事件
使用者將游標從一個元素上方移動到另一個元素時觸發。
mousewheel事件
這個事件跟蹤滑鼠滾輪。
一次click事件觸發順序
mousedown --> mouseup --> click
鍵盤與文字事件
keydown事件
當使用者按下鍵盤上的任意鍵時觸發。按住不放，會重複觸發。
keypress事件
當使用者按下鍵盤上的字元鍵時觸發。按住不放，會重複觸發。
keyup事件
當使用者釋放鍵盤上的鍵時觸發。
使用者按了一下鍵盤上的字元鍵時事件觸發順序 keydown --> keypress--> keyup
如果使用者按下字元鍵不放時，就會重複觸發keydown --> keypress
如果使用者按下非字元鍵時，就會觸發keydown --> keyup
鍵碼
在觸發事件時，event物件的keyCode屬性會包含一個程式碼，與鍵盤上的一個特定鍵對應。