Web/Events

https://developer.mozilla.org/zh-TW/docs/Web/Events/keyDown

keydown、keypress、keyup：介面：KeyboardEvent (每個 event 相當於一個基於 Event 介面的物件)

input：介面：Event, InputEvent

keypress 事件：

所按的鍵必須是具有 KeyAscii 碼的按鍵，才會觸動執行此事件。
一個會產生一個字符值的鍵被按下時被觸發。(中文輸入法不會觸發 KeyPress 事件)

KeyUp 事件：

Default Action：none

KeyDown / KeyUp 事件：

在指定物件上偵測到鍵盤有鍵被按住 / 放開。
可以處理 KeyPress 事件無法處理的按鍵 (例如：功能鍵、編輯鍵及組合鍵)。

KeyDown / keypress 事件：

Default Action：變數：keypress 事件; 啟動文字組成系統; blur 和 focus 事件; DOMActivate 事件; 其他事件

Web/API/KeyboardEvent

https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent

KeyboardEvent 物件，描述「使用者與鍵盤的互動」。每個事件描述一個按鍵；事件類型（event type：keydown, keypress, 或 keyup ) 識別哪一種動作。

Properties

KeyboardEvent.charCode：唯讀，返回 "keypress" 事件按下的字符键的字符 Unicode 值。此屬性僅 keypress 事件使用，按鍵的 char 屬性會包含多個字符，這是屬性中第一個字符的 Unicode 值。 已棄用：請改用 char
KeyboardEvent.keyCode：唯讀，代表一個系統和執行相關的數字代碼。識別 keypress 的鍵的未修改 (被 ctrl / shift 改變？) 的值。這通常是與 Key 對應的十進制 ASCII（RFC 20）或 Windows 1252 代碼。如果無法識別，則該值為 0。 按鍵事件的值在瀏覽器之間是不同的。
- IE 和 Google Chrome 設置 KeyboardEvent.charCode 的值。
- 如果為可列印鍵，則 Gecko（FF）設為 0，
- 不可印則設置為 keydown 或 keyup 事件的 keyCode。 已棄用：請改用 key
KeyboardEvent.which：将 keyCode 和 charCode 标准化了。建議用 which 来监视键盘输入。唯讀，返回按下的鍵的數字鍵碼、或按下的字母（charCode）。 已棄用：請改用 key
KeyboardEvent.code：此屬性表鍵盤上的「實體鍵」。這個屬性返回的值不會被鍵盤佈局或修飾鍵的狀態所改變。如果是虛擬鍵盤或輔助功能設備，返回值將由瀏覽器設置為盡可能匹配時體鍵盤所發生的情況。請注意，要確定哪個「字符與鍵事件對應」，請改用 KeyboardEvent.key 屬性。
KeyboardEvent.key：返回用户按下的键盘「實體按键的值」。这个 API 和 KeyboardEvent.keycode、KeyboardEvent.which 的区别是： API 返回的是「键名」，而不是「键值」，如，返回「Enter」而不是「13」。

input and 中文輸入法

輸入欄位「啟用中文輸入法」時，將不會觸發 KeyPress 事件，而 KeyDown 事件中的 KeyCode 則固定傳回 229。

IE9, Firefox 4, Chrome 支援按鍵 Input 事件，
在 IE9 / Firefox4 上可輔助判別中文輸入的細節，
但 IE7 不支援，
Chrome 的行為不同。

jQuery 绑定 "input" 事件和 "change" 事件监听的区别

input 事件在输入框「值发生改变时」触发, 比如文本 ("text") 输入框输入或删除文字, 选择 ("select") 输入框值改变等, "input" 事件不能监听复选框 ("checkbox") 选项变化,
change 能够监听复选框选项变化，亦可监听其他类型输入框输入。与 "input" 事件不同, "change" 事件「不监听」实时输入 (针对文本输入框) , 只有在输入框「失去焦点时才触发」,

每次輸入中 / 英文字時，觸發 input 事件

$("#txtTest").bind("input", function() {
  var v = this.value; //可取得目前的文字內容
});

雖然「無法掌握按鍵內容」，但已可滿足掌握「中文輸入模式」下，每次文字變動的需求。

使用 KeyUp 事件，抓取每個按鍵的 keyCode

但連選字時的上下鍵、送字的 Space... 都會包含在內。 http://jsbin.com/bemomep/2/edit?html,js,output

<!DOCTYPE html>
<html>
<head>
<script type='text/javascript'
        src='http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.5.1.js'></script>
 <script>
  $(function() {
  var $log = $("#dvLog");
  $("#txtTest").bind("keypress", function (e) {
      $log.append("<div>KeyPress: " + e.which + "</div> ");
    }).bind("keydown", function (e) {
      $log.append("<div>KeyDown: " + e.which + "</div> ");
    }).bind("input", function (e) {
      $log.append("<div>input</div>");
    });
    $("#btnClear").click(function() { 
      $log.empty(); 
    });

    $("#txtTest").bind("input", function() {
      var v = this.value; // 可取得目前的文字內容
      console.log(v)
    });
  });

  </script>
</head>
<body>

<input type="text" id="txtTest" />
<input type="button" id="btnClear" value="clear" />
<div id="dvLog" style="border: 1px solid red; font-size: 9pt;"></div>
</body>
</html>

輸入一個中文字