uniy

请教前端大神们一个问题,如何限定一个输入框,一定是英文输入状态?

  •  
  •   uniy · May 8, 2021 · 2836 views
    This topic created in 1842 days ago, the information mentioned may be changed or developed.

    背景: 电脑连接扫码枪,扫码录入,中文状态下录入异常(慢+换行错误),英文输入法下,录入正常。

    期望的效果: 只要输入框获取焦点,输入法自动切换为英文。

    16 replies    2021-05-11 09:03:33 +08:00
    0TSH60F7J2rVkg8t
        1
    0TSH60F7J2rVkg8t  
       May 8, 2021   ❤️ 1
    <input type="text" name="name" value="initial value" style="ime-mode: disabled">.
    说明来自这里: https://developer.mozilla.org/zh-TW/docs/Web/CSS/ime-mode
    uniy
        2
    uniy  
    OP
       May 8, 2021
    @ahhui ime-mode is deprecated, 并且大部分浏览器已经不支持了,https://developer.mozilla.org/en-US/docs/Web/CSS/ime-mode
    devld
        3
    devld  
       May 8, 2021
    自定义一个假的”输入框“,监听 `keydown` 事件,只处理合法的字母数字键?
    zhaoy
        4
    zhaoy  
       May 8, 2021
    强答,刚查的

    https://developer.mozilla.org/zh-TW/docs/Web/CSS/ime-mode

    ```html
    <input style="ime-mode:auto" />
    <input style="ime-mode:active" />
    <input style="ime-mode:inactive" />
    <input style="ime-mode:disabled" />
    ```

    试试看,Chrome 、Edge 、好像不行,IE 可以,火狐有效效果不完整
    zhaoy
        5
    zhaoy  
       May 8, 2021
    uniy
        6
    uniy  
    OP
       May 8, 2021
    @zhaoy 要的就是 ime-mode 的效果,但是浏览器对这个支持不友好
    christin
        7
    christin  
       May 8, 2021 via iPhone
    前端应该不能直接判断输入法状态吧 得有输入才能做判断
    我提供一个思路 输入框做 input 检测 有中文就 alert 提醒转换为英文输入法
    gaoryrt
        8
    gaoryrt  
       May 8, 2021
    input pattern 可以正则
    gaoryrt
        9
    gaoryrt  
       May 8, 2021
    或者是 inputmode 可以控制虚拟键盘类型
    sixway
        10
    sixway  
       May 8, 2021
    我比较好奇为啥中文输入法会出现异常。
    vinsony
        11
    vinsony  
       May 8, 2021 via Android   ❤️ 3
    前面放个透明的密码框
    heyjei
        12
    heyjei  
       May 8, 2021
    @vinsony 这个主意棒,选中密码框时,输入法自动变成了英文了。
    uniy
        13
    uniy  
    OP
       May 10, 2021
    @vinsony 这个是比较好的方案,但是不是所有的电脑都能够起作用
    uniy
        14
    uniy  
    OP
       May 10, 2021
    @devld 这种不会改变输入法,而且条码内容不是固定的
    gdrk
        15
    gdrk  
       May 11, 2021
    IE 和 Firefox 可以用 ime-mode: disabled,但是 Chrome 似乎并没有打算支持
    https://developer.mozilla.org/en-US/docs/Web/CSS/ime-mode
    因为 password 就可以默认英文输入法,用 password 模拟(手机端还不错,桌面端不能显示光标--https://codepen.io/gdrk/pen/KOaZxy
    gdrk
        16
    gdrk  
       May 11, 2021
    @gdrk 光标可以显示,示例里 css 去掉了。但是我映像里是有个不影响功能的小 bug,时间太久忘了。。。
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Solana   ·   3688 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 86ms · UTC 05:01 · PVG 13:01 · LAX 22:01 · JFK 01:01
    ♥ Do have faith in what you're doing.