如何通知移动键盘有关 html 输入控件的所需输入？

How to inform the mobile keyboard about the desired input for a html input control?

有没有办法通知移动设备上的移动键盘，HTML 输入字段的可能值是可能值的子集？

我试着用一个例子更好地表达自己。

假设我有一个用户名输入文本：

<input type="text" id="username">

当尝试使用移动设备打字时，移动键盘会执行三项不需要的操作：

  1. 它试图让我开始输入大写字母作为第一个字符
  2. 它在“.”之后添加了一个 space
  3. 它试图让我在“.”之后开始输入大写字母

因此，如果我想输入 j.doe（典型用户名示例）

然后我输入（一次一个）：j . d o e 我得到 J. Doe

作为高级移动键盘用户，我可以尝试通过以下方式获得所需的结果（例如在具有导航箭头的 Swiftkey 上）：

  1. 按两次大写锁定（这样就绕过了首字母大写限制）
  2. 键入j.（两个字符也可以，但键盘会在'.'后添加一个space）
  3. 按左键盘（将光标定位在“.”之后）
  4. 按大写锁定两次（再次删除'.'后的大写限制）
  5. 输入doe

我已经完成了，但是对于不熟练的用户来说，这是不可接受的（尤其是 (1)、(3) 和 (4)）。

不知怎么的，我希望键盘的行为就像在密码字段中输入一样（没有 Caps Lock 自动激活，也没有在 '.' 后添加 spaces）。

我没有设法找到解决方案，有谁知道实现结果的方法吗？

谢谢！

尝试使用这些 HTML 属性关闭移动设备自动修复：

<input type="text" id="username"
  autocapitalize="off" 
  autocomplete="off"
  spellcheck="false" 
  autocorrect="off"/>

来源：https://weblog.west-wind.com/posts/2015/jun/15/turn-off-html-input-auto-fixups-for-mobile-devices

我用谷歌搜索“ios 输入小写字母”，这是第一个结果：

iPhone browser defaulting to uppercase for first letter of password fields

简而言之，在输入字段中添加属性 autocapitalize="none"，并输入 autocomplete="off" 和 autocorrect="off" 以备不时之需。

您需要将 autocorrect 和 autocapitalize 属性添加到输入标签并将它们设置为禁用。

例如：

<input type="text" id="username" autocorrect="off" autocapitalize="none">

Blog with explanation on the same

或onkeydown您可以将键值转换为小写

onkeydown = function keyDown(e) {
  
  let keyPressed =  String.fromCharCode(e.keyCode).toLowerCase();
  .....

};

要真正确保该字段不是大写，您可以将其类型设置为 email

<input type="email" id="loginId"  autocapitalize="off"   autocomplete="off"  spellcheck="false"  autocorrect="off"/>

没有进行任何验证，因此您仍然可以在“电子邮件”字段中输入用户名。

在 JS 中获取这个

var loginInput=document.getElementById("loginId");
loginInput.setAttribute("type","email");