因為在做專案需要用到類似驗證碼的東西,雖然只是輸入四個英文字母,卻在前端這塊卡關了...
問題
我希望使用者在點到輸入框的時候可以切換成英文輸入法(因為是四個英文字母),而不是把英文以外的字都替換成空字串。大概是像下面這樣:
可以觀察到如果不是英文輸入法會很不方便,所以我想找方法,如果可以點上去就自動換成英文輸入法呢?
解決方法
原本以為可以有些 API 可以用,但很不幸的,唯一可以用的 ime-mode 只有 IE 跟火狐支援,所以這不是好方法。
所以要做到自動切輸入法要利用 input type=password 的特性
可以發現在 password 中,我們的輸入法被鎖定在英文。如果我們點擊輸入框時,將 focuse 定在 password 上,更改完輸入法,在回到原本的輸入框上,就可以做到自動改輸入法了。
不過這個也不是完美個方案,經過測試在某些瀏覽器的無痕模式下,離開 password 就會回到原本的輸入法了。如果想要鎖定輸入法就要做虛擬的輸入框了。