onClick：點擊某一個物件時
onDbclick：雙重點擊某一個物件時
onBlur：失去焦點時
onFocus：得到焦點時
onError：產生錯誤時
onAbort : 圖片下載被中斷時
onSubmit：送出表單資訊時
onReset：表單重設時
onSelect：表單選項被改變時
onChange：改變物件選項或字串時
onScroll：網頁文件被上下捲動時
onResize：調整瀏覽器視窗大小時
onCopy：資料拷貝時
onCut：資料剪下時
onPaste：資料貼上時
onLoad：瀏覽器載入網頁時
onUnload：瀏覽器離開網頁時
onBeforeUnload：瀏覽器離開網頁前的時候
== 如何設定啟用 onLoad 及 onUnload 事件
使用 <body onLoad="alert(str1)" onUnload="alert(str2)">
或使用 window.onLoad=func1; 和window.onUnload=func2;
註:由於 onUnload 事件是在瀏覽器離開網頁時觸發, 由於事件傳遞可能會有時間差, 所以 onUnload 事件的處理程序不一定能完整執行完畢, 若要保證該段程式碼必須於視窗關閉執行完畢, 則需使用 onBeforeUnload 事件函式處理
== 處理鍵盤事件
onkeyDown：在鍵盤上按下任何一個按鍵時觸發(包含單獨按下 Shift, Ctrl, Alt, Tab... 等按鍵)
onkeyUp：鍵盤上的按鍵釋放時觸發
onkeyPress：於keyDown及keyUp均會檢查, 若當時的鍵盤可取得一個正確的按鍵值時就會觸發 onkeyPress 事件(Shift, Ctrl 等需為組合鍵時才會觸發)
使用方式
1. 指定處理鍵盤事件的函式
使用 <body onkeydown="keyDown(event)"> (需傳入 event 物件)
或使用 document.onkeydown=keyDown; (只要設定函數名稱, 在函式內直接使用 event 物件)
2. 在函式內讀取 event 物件內的相關參數值可得知當時鍵盤的按鍵狀況
event.keyCode 的值在 onkeyDown 及 onkeyPress 事件時會傳回不同的值
在 onkeyDown 事件中, event.keyCode 為按鍵代碼, 而在在 onkeyPress 事件中, event.keyCode 的傳回值則為按鍵值的ASCII CODE
如 B 的按鍵代碼為 66, 在onkeyDown事件中其傳回值永遠是66, 但在onkeyPress事件時則會依大小寫不同而傳回不同的值(B為66, b為98)
另如 , 和 < 是同一個按鍵, 其按鍵代碼為 188, 在onkeyDown事件中其傳回值永遠是188, 但在onkeyPress事件時若單獨按下該鍵會是,號的ASCII(44), 若shift 也同時按下則會<號的ASCII(60)
依大小寫不同而傳回不同的值(B為66, b為98)
event.shiftKey, event.ctrlKey, event.altKey 等值, 可研判 Shift, Ctrl 及 Alt 等按鍵的狀態(true 表按鍵被按下)
== 處理滑鼠事件
onMouseDown：按下滑鼠按鈕時
onMouseUp：鬆開滑鼠按鈕時
onMouseMove：滑鼠移動時
onMouseOver：滑鼠移動進入某個物件時
onMouseOut：滑鼠移動離開某個物件時
onMouseWheel：滑鼠滾動滾輪時
onDrag：滑鼠「拖」動時
onDrop：滑鼠「放」下時
onClick：滑鼠點擊時
onDbclick：滑鼠雙重點時
與滑鼠事件相關的屬性值
event.button : 取得哪一個滑鼠按鍵被按下
W3C標準 -> 0:左鍵, 1:中鍵, 2:右鍵
IE瀏覽器 -> 1:左鍵, 4:中鍵, 2:右鍵
event.x, event.y, event.clientX, event.clientY : 滑鼠相對於視窗位置的x與y座標值;
event.offsetX, event.offsetY : 滑鼠與發送事件之物件的其相對位置x與y之座標值;
== 其他事件的屬性值
event.srcElement : 產生事件的物件或元素
event.type : 事件類別
== 限制瀏覽器部份功能的方法
<body
onMouseover="window.status='';return true;" (清空狀態列內容 - 不顯示狀態列)
onDragStart="window.event.returnValue=false" (取消拖曳功能)
onContextMenu="window.event.returnValue=false" (取消按右鍵出現選單的功能)
onSelectStart="event.returnValue=false"> (取消全選功能)
沒有留言:
張貼留言