星期二, 2月 05, 2013

[JS] keyCode for KeyDown, KeyPress and KeyUp

  之前就一直蠻困惑這問題的, 這次索性做個例子解釋一下原因.首先還是從最基本原理先解釋一下. 為求看得清楚,我這邊就使用 KeyDown, KeyPress 跟KeyUp 大小寫區分.

  • KeyDown: 鍵盤按鍵按下去所觸發事件, 若一直按著, 就一直觸發. (合理! 因為一直按著字就一直出來.)
  • KeyPress: 鍵盤按鍵按下去所觸發事件, 順序是先 KeyDown 然後再觸發 KeyPress.
  • KeyUp: 放開鍵盤按鍵時候觸發事件.
  下面是我使用 YUI所建立的範例, 若執行可以很簡單看出來 KeyDown, KeyPress所回傳的 key code是不同的.
  而 KeyPress的 key code就是按鍵的 ASCII值. 而我們使用Shift去切換大小寫對KeyPress的key code有影響, 但是對 KeyDown沒影響 (以大寫的 key code為主).

  • KeyCode範例

Check out this Pen!


  附註一點我試做了若持續按著鍵盤觸發, 擷取 KeyDown跟 KeyPress先後順序的記錄下來看, 發現其先後順序並非交錯執行( KeyDown-> KeyPress-> KeyDown-> KeyPress), 這是要注意的地方.


沒有留言: