1. 程式人生 > >js捕獲鍵盤事件之keydown、keyup以及keypress

js捕獲鍵盤事件之keydown、keyup以及keypress

js keyup、keypress和keydown事件都是有關於鍵盤的事件

當一個按鍵被pressed 或released在每一個現代瀏覽器中,都可能有三種客戶端事件。

  1. keydown event
  2. keypress event
  3. keyup event

keydown事件發生在鍵盤的鍵被按下的時候,接下來觸發keypress事件。 keyup 事件在按鍵被釋放的時候觸發。

這三個事件在頁面中的使用方法如下例:

<input id="testkeyevent" name="testkeyevent"  onKeyUp="keyup()" />

<input id="testkeyevent" name="testkeyevent"   onkeypress

="keypress()" />

<input id="testkeyevent" name="testkeyevent"   onkeydown="keydown()" />

對應的js函式:

function keyup(){ ...}

function keypress(){ ...}

function keydown(){ ...}

注意:

  1. KeyDown觸發後,不一定觸發KeyUp,當KeyDown 按下後,拖動滑鼠,那麼將不會觸發KeyUp事件。
  2. KeyPress主要用來捕獲數字(注意:包括Shift+數字的符號)、字母(注意:包括大小寫)、小鍵盤等除了F1-12、SHIFT、Alt、Ctrl、Insert、Home、PgUp、Delete、End、PgDn、ScrollLock、Pause、NumLock、{選單鍵}、{開始鍵}和方向鍵外的ANSI字元
  3. KeyDown 和KeyUp 通常可以捕獲鍵盤除了PrScrn所有按鍵(這裡不討論特殊鍵盤的特殊鍵)
  4. KeyPress 只能捕獲單個字元
  5. KeyDown 和KeyUp 可以捕獲組合鍵。
  6. KeyPress 可以捕獲單個字元的大小寫
  7. KeyDown和KeyUp 對於單個字元捕獲的KeyValue 都是一個值,也就是不能判斷單個字元的大小寫。
  8. KeyPress 不區分小鍵盤和主鍵盤的數字字元。
  9. KeyDown 和KeyUp 區分小鍵盤和主鍵盤的數字字元。
  10. 其中PrScrn 按鍵KeyPress、KeyDown和KeyUp 都不能捕獲。
  11. 在使用鍵盤的時候,通常會使用到CTRL+SHIFT+ALT 類似的組合鍵功能。對於此,我們如何來判定?

         通過KeyUp 事件能夠來處理(這裡說明一下為什麼不用KeyDown,因為在判定KeyDown的時候,CTRL、SHIFT和ALT 屬於一直按下狀態,然後再加另外一個鍵是不能準確捕獲組合鍵,所以使用KeyDown 是不能準確判斷出的,要通過KeyUp 事件來判定 )