HTML:为什么Android浏览器显示“Go"?而不是“下一步"在键盘? [英] HTML: Why does Android browser show "Go" instead of "Next" in keyboard?

查看:19
本文介绍了HTML:为什么Android浏览器显示“Go"?而不是“下一步"在键盘?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有一个 HTML 登录表单,其中包含以下元素(按此顺序):

I have an HTML login form that contains following elements (in this order):

  • input type=text(用户名输入)
  • input type=password(密码)
  • input type=submit(登录按钮)
  • input type=text (user name input)
  • input type=password (password)
  • input type=submit (Login button)

当焦点在文本输入时,为什么Android浏览器在软键盘上显示Go"按钮而不是Next"按钮?这很容易导致用户登录失败,因为输入用户名后,用户按下键盘右下角的按钮(通常是正确的动作),提交的表单将带有空密码,这显然是行不通的.[如果我的浏览器设置为记住密码并且密码管理器能够填写密码,则这种行为是有意义的.但是,这里的情况并非如此,因为您可以在下面进行测试.]

Why does the Android browser show "Go" button in soft keyboard instead of "Next" button when the focus is in the text input? This causes user to fail to login very easily because after entering the user name, the user presses the bottom right button in the keyboard (usually the correct action) and the form will be submitted with an empty password, which obviously is not going to work. [This behavior would make sense in case my browser was set to remember passwords and the password manager would be able to fill in the password. However, this is not the case here as you can test yourself below.]

我希望输入类型文本具有下一步"按钮,输入类型密码(提交前的最后一个输入)具有开始"按钮.

I'd like to have the input type text to have "Next" button and the input type password (the last input before the submit) to have the "Go" button.

有问题的表单示例位于 https://peda.net/:login(此表单包含用于检测输入的Enter"键并防止提交表单的代码,除非聚焦到最后一个可见的表单输入).

An example of problematic form is at https://peda.net/:login (this form contains code to detect "Enter" key for the input and prevents submitting the form unless the last visible form input is focused).

您知道解决此问题的真正方法吗?我知道如果我要实现本机应用程序,我会使用 android:imeOptions="actionNext"(请参阅 如何将 Android 软键键盘的Go"按钮更改为Next").但是,在这种情况下,它是一个 HTML 表单和 Android 默认浏览器.

Do you know a real fix for this issue? I know that if I were implementing native application, I'd use android:imeOptions="actionNext" (see How to change the Android softkey keyboard "Go" button to "Next"). However, in this case it's an HTML form and Android default browser.

该问题至少在以下配置中可见:

The problem is visible with at least following configurations:

  • 在 Android 2.3.4 (Cyanogenmod 7) 上运行的浏览器"系统应用
  • 在 Android 4.2.2 (Cyanogenmod 10.1) 上运行的浏览器"系统应用
  • 在 Android 4.3.1 (Cyanogenmod 10.2 M1) 上运行的浏览器"系统应用
  • 在 Android 4.4.2 (Cyanogenmod 11.0 M3) 上运行的浏览器"系统应用(AOSP 浏览器)
  • 在 Android 5.5.1 (Cyanogenmod 12.1) 上运行的浏览器"系统应用(AOSP 浏览器)[有一个箭头图标而不是Go"一词]
  • 在 Android 6.0.1 (Cyanogenmod 13.0) 上运行的浏览器"系统应用(AOSP 浏览器)[有一个箭头图标而不是Go"一词]

推荐答案

这是 Chromium 问题,如果您想观看它:https://bugs.chromium.org/p/chromium/issues/detail?id=410785

This is the Chromium issue if you want to watch it: https://bugs.chromium.org/p/chromium/issues/detail?id=410785

这里有一个适用于 Android 的解决方法,它更改用户输入中的输入",以便它切换"到密码字段(并且不提交表单):

Here is a workaround for Android that changes the "enter" in the user input so that it "tabs" to the password field (and doesn't submit the form):

http://jsbin.com/zakeza/1/quiet

<form action="?">
  User <input type=text onkeypress=key(event)><br><br>
  Password <input id=pw type=password><br><br>
  <input type=submit>
</form>

<script>
  function key(event) {
    if (event.charCode == 13 && /Android/.test(navigator.userAgent)) {
      event.preventDefault();
      document.getElementById('pw').focus();
    }
  }
</script>

注意 Windows Phone 还将 Android 放入 UA,因此需要在 Windows Phone(和 Android Firefox)上进行测试.

Note Windows Phone also puts Android into the UA, so needs testing that works on Windows Phone (and Android Firefox).

这篇关于HTML:为什么Android浏览器显示“Go"?而不是“下一步"在键盘?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆