讀取 html 輸入元素中的資料

html 中有些 form 元素像 input 是設計來讓使用者輸入的， 使用者輸入的資料會存在 value 屬性裡。 至於要什麼時候 觸發 ， 有用額外按鈕、偵測 Enter 鍵、偵測新輸入的字元， 但都不太直覺。

主要問題是輸入的東西是存到一個元素的屬性， 在 C 中可能是按 Enter 會觸發 scanf， 但 html 中並統一一個 完成輸入 的概念。 只有一堆事件給你偵測，而且沒有一個是最好的。

聽 input 事件

當使用者在打字，也就是 input 元素的內容一變， 就會發出 input 事件。 可以每次新輸入就讀取； 如果不想太頻繁，可以用空白鍵模擬 Enter， 也就是如果輪入的是空白，就發出訊息。

聽 keydown Enter 事件

上面為什麼用空白？因為不能用 enter。 input 元素的內容不能是 Enter。 所以按 Enter 不會輸入 Enter， 也不會觸發 Enter 事件。

有另一組事件是 keydown，就聽得到 Enter 事件。 但我不太喜歡這個事件， 因為感覺相對 input 元素是另一個系統。 除了 enter，鍵盤其它按鍵也都抓得到。

所以我才會聽 input 事件輸入是 space 的。 中文不太會用空白鍵，英文才會， 所以中文可以聽 input 就好。

聽 form submit 事件

另一個比聽空白還奇葩的作法是聽 form submit。 瀏覽器多會做一個功能， 當在表單最後一個元素按 Enter 時，就會自動送出表單。 所以如果你的 input 在 form 裡， 可以直接聽 form 的 submit 事件。

其它

當然還有很多事件可以用： 像 blur 是結束輸入後，也就是元素失去焦點時。 change 則是失去焦點且內容改變時。 但用 change 反而不太直覺， 輸入完後要點其它輸入框或頁面空白處才會觸發。

我在做 倉頡新星 就是用 input 和空白， 因為倉頡輸入法就是用空白，且我不喜歡用 keydown。

之前一個外國人寫的 中文輸入法遊戲 ， 一開始聽 keyup，結果我用輸入法時按 Enter 好像不會送出 keyup， 後來他改用 keydown 就好了。 keydown 對中文輸入法較友好。