input 标签聚焦时怎么自动切换英文输入法

1. 利用 lang 属性 (效果有限)

lang 属性

<p lang="en" xml:lang="en">
  <el-input v-model="value" type="text" lang="en" xml:lang="en"></el-input>
</p>

2. ime-mode (仅火狐和 IE 支持)

ime-mode 属性

<p>
  <el-input v-model="value" ime-mode="inactive"></el-input>
</p>

3. inputmode 属性

inputmode=latin 属性

<p>
  <el-input v-model="value" inputmode="latin"></el-input>
</p>

3. type 属性

type=url

<p>
  <el-input v-model="value" inputmode="latin"></el-input>
</p>

结论

基本所有的属性都只生效一次, 后续控制不了

官方解释现代浏览器的安全策略限制了脚本对输入法行为的控制, 有几个方案考虑下:

1. 用户输入时, 前端实时检测一下, 如果是中文内容, 不给输入框赋值 或者弹窗提示用户改用英文输入
2. 与客户端交互, 利用端本地能力修改用户的系统设置