前陣子同事的專案需要在前端限制 textarea 只能輸入數字,主要的做法是使用 keydown 事件偵測現在按下的是什麼字,只要不是被允許的字元就不能夠輸入。
但是,中文輸入並不像英文輸入一樣按下按鍵就能直接完成輸入,而是會在注音或拼音組出一個字並按下 Enter 後,或者從 textarea focusout 才能完成輸入,在此之前 keydown 事件都將輸入視為 處理(Process) 的狀態而無法有效抵擋中文輸入,然而我們可以使用 JavaScript 監聽 compositionstart 和 compositionend 事件來達成。