我有一个HTML登录表单,其中包含以下元素(按此顺序):
input type=text
input type=password
input type=submit
当焦点位于时,为什么Android浏览器在软键盘上显示“转到”按钮而不是“下一步”按钮text input?这会导致用户无法轻松登录,因为在输入用户名后,用户按下键盘右下角的按钮(通常是正确的操作),表单将使用空密码提交,这显然是行不通的。[如果我的浏览器设置为记住密码,并且密码管理器可以填写密码,则此行为很有意义。但是,这里不是这种情况,因为您可以在下面进行自我测试。]
text input
我想让输入类型文本具有“下一步”按钮,让输入类型密码(提交之前的最后输入)具有“开始”按钮。
有问题的表单的示例位于https://peda.net/:login(此表单包含用于检测输入的“ Enter”键并阻止提交表单的代码,除非最后一个可见的表单输入被聚焦)。
您知道此问题的真正解决方法吗?我知道,如果要实现本机应用程序,我会使用android:imeOptions="actionNext"(请参阅如何将Android软键键盘的“转到”按钮更改为“下一步”)。但是,在这种情况下,它是HTML表单和Android默认浏览器。
android:imeOptions="actionNext"
该问题至少在以下配置中可见:
Android浏览器始终显示“输入”字段,因为网络上的某些表单(尤其是搜索框)没有提交按钮,并且只能通过按Enter激活(Go等同于Enter)。
取而代之的是,某些版本的Android将在键盘的右下角显示一个Tab键,以方便在表单字段之间导航。
我认为您无法阻止这两种行为。
两种可能的解决方法:
使用JavaScript忽略提交登录表单,直到两个输入都为非空白为止:
<form name="loginForm" onsubmit="return document.loginForm.user.value != '' && document.loginForm.pass.value != ''"> <input type="text" name="user"> <input type="password" name="pass"> <input type="submit" value="Login">
最干净的解决方案是使用新的HTML5 required属性将两个输入都设置为必需- 但 Android浏览器尚不支持此输入。但是,一种好的方法是用JavaScript后备(例如CSSKarma描述的)来补充所需的属性。