html中input框自动切换对应的中文或英文输入法

最近遇到一个移动端要求，点击输入框时输入法的切换，记录总结下

 

用到一个css非标准的ime-mode属性，ime是Input Method Editor的简称。它是一种专门的应用程序， 用来输入代表东亚地区书面语言文字的不同字符。

 

语法：

ime-mode : auto | active | inactive | disabled

 

 

取值：

（1）auto : 默认值。不影响ime的状态。与不指定 ime-mode 属性时相同

（2）active : 指定所有使用ime输入的字符。即激活本地语言输入法。用户仍可以撤销激活ime

（3）inactive : 指定所有不使用ime输入的字符。即激活非本地语言。用户仍可以撤销激活ime

（4）disabled : 完全禁用ime。对于有焦点的控件(如输入框)，用户不可以激活ime

 

兼容：ime-mode目前Safari/Chrome/Opera不支持，因为是移动端所以兼容良好。测试完成后回来完善下本文。

 

 

<input id="test1" name="test1" style="ime-mode:disabled">
<!--第一个是不显示输入法，即用键盘也不能切换输入法-->
<input id="test2" name="test2" style="ime-mode:active">
<!--第二个是自动切换成英文的输入法，但还可以用键盘切换-->
<input id="test3" name="test3" style="ime-mode:inactive">
<!--第三个是自动切换成中文输入法，但还可以用键盘切换-->
<input id="test4" name="test4" style="ime-mode:auto">
<!--第四个是根据当前的输入法来确定的，如果当前是英文的，那就显示英文，是中文的那就显示中文-->

 

说明：

         设置或检索是否允许用户激活输入中文，韩文，日文等的输入法(ime)状态。

         此属性对于 currentstyle 对象而言是只读的。对于其他对象而言是可读写的。对应的脚本特性为 imemode 。

 

示例：input {ime-mode: auto; }

         就是这样。所以当某个文本域不需要中文输入的时候，我们可以通过设置 ime-mode 属性值为 inactive 或者 disabled，减少错误的可能性。同样的我们可以设置那些需要中文输入的文本域的 ime-mode 属性值为 active。

         通常C/S的业务系统，都会注意输入法的控制问题。开发基于B/S的业务系统，也一定会遇到同样问题，ime-mode相信可以帮上忙。不过 FireFox 并不支持这一样式单属性。