JavaScript Event(事件) - Mouse, Keyboard, HTML Event

Mouse Event(滑鼠事件)

透過event.type來取得的事件名稱沒有on開頭

JavaScript Mouse Event(滑鼠事件)

名稱	說明
onmousedown	按下mouse按鍵，不論左右鍵
onmousemove	移動mouse
onmouseout	mouse指標離開HTML標籤
onmouseover	mouse指標進入HTML標籤
onmouseup	放開mouse按鍵
onclick	按一下mouse左鍵
ondblclick	按二下mouse左鍵

按一下Mouse共會引發三個事件，mousedown → mouseup → click。

隱藏Mouse右鍵選單

Mouse右鍵會觸發一個contextmenu事件，即選單事件，我們只要在contextmenu事件裡取消此事件產生動作，即可隱藏右鍵選單。

function blockMenu(Evt){
  // window.event 是IE才有的物件
  if(window.event){
    Evt = window.event;
    Evt.returnValue = false;//取消IE預設事件
  }else
    Evt.preventDefault();//取消DOM預設事件
}
document.oncontextmenu = blockMenu; 

Keyboard Event(鍵盤事件)

透過event.type來取得的事件名稱沒有on開頭。

JavaScript Keyboard Event(鍵盤事件)

名稱	說明
onkeydown	按下鍵盤按鍵
onkeypress	在keydown與keyup之間的事件，或是按著不放時所觸發
onkeyup	放開鍵盤按鍵

HTML Event(HTML事件)

透過event.type來取得的事件名稱沒有on開頭。

JavaScript HTML Event(HTML事件)

名稱	說明
onload	頁面完全載入後在window物件上觸發，圖片載入完成後在其上觸發
onunload	頁面完全卸載後在window物件上觸發，圖片卸載完成後在其上觸發
onabort	放棄圖片載入
onblur	離開擁有處理權的物件
onchange	在取得處理權後，更改過文字方塊的內容，離開文字方塊時觸發
onerror	腳本出錯時在window物件上觸發，圖片無法載入時在其上觸發
onfocus	指定物件擁有處理權
onreset	重設表單
onselect	選擇網頁內容
onsubmit	送出表單

就我們在撰寫網頁相關程式碼中，又以onblur、onchange、onfocus、onreset、onselect、onsubmit這幾個表單事件(form event)最為重要，除了UI的程式碼外，表單是我們很重要與使用者互動的來源，一個良好的表單互動就能簡單讓您的網站有很大的加分的效果，所以這幾個事件的處理份量會比較重一些。