HTML PhoneGap Android: 数字软键盘有“下一步”按钮而不是“前往”按钮。

Question

这让我很困扰，我无法在任何地方找到答案。

我的phonegap应用程序中有表单。如果输入类型为"text"，则会弹出文本键盘，并在角落处显示“go”。当您单击 go 时，它会提交表单。这正常工作，符合我的预期。但是如果我使用 input type="number"，则数字键盘会弹出，并且在角落处显示“next”。当您单击 next 时，如果按钮标签之前还有另一个输入框，则会转到该输入框。这样也可以……不是理想，但讲得通。但是，如果是页面上的最后一个输入字段，则单击“下一步”不起作用。它不会将焦点放在按钮上（即使使用tabindex），也不会提交表单（这是理想的）。

我正在使用 phonegap 1.3.0 和 jquery 1.7，如果这些有帮助的话。

- grail143

---

+1，我正在尝试一切。同时，PhoneGap已经更新到1.5.0版本，我使用的是jQueryMobile 1.0.1。没有进展。我已经尝试了是否与任何字段属性有关，但无济于事。 - Wytze

看起来这不是PhoneGap的问题 - 在普通的Android浏览器中也会发生。 - JW.

这与PhoneGap无关是事实。虽然我认为有一种基于Java的方法来修复它，因为我的应用程序是PhoneGap。到目前为止，我找到的唯一解决方法是Wytze的隐藏字段，该字段自动提交表单。这是一个非常糟糕的hack，而我们现在已经升级到了PhoneGap 2.0。我仍然认为这是Android开发人员做出的非常讨厌的决定。 - grail143

Answer 1

您可以使用以下 JQuery 绑定来检测下一个键盘按键：

$('input').on('keydown', function(e){
    if(e.which === 9) {
        //your code here
    }
});

'下一个'按钮模拟了键盘上的tab键事件，它的键码是9。不幸的是，keypress和keyup事件不能检测到下一个键事件，因此您需要在keydown上绑定它。

希望能对您有所帮助！

- Rum Jeremy

Answer 2

好的，现在我有一个看起来像答案、像鸭子一样的东西。

这是一个可怕的hack，我目前正在经历一些副作用，但无论如何，这对人类来说是一个小的飞跃。

向您的表单添加一个不可见的文本输入框，当它获得焦点时自动提交表单。由于它只能通过用户按下“下一个”或从最后一个数字字段切换焦点来获得焦点，因此用户序列中应该有相当坚实的逻辑。

<input type='text' style="opacity:0;" onfocus="javascript:$('#thisForm').submit();">

副作用包括：

• 隐藏的表单字段会短暂地显示出来。您可以通过使用onfocus处理程序来重新聚焦到刚刚离开的数字字段，或者将输入框的宽度设置为0来避免这种情况。后一种方法对我来说效果最好。
• 如果像我一样使用jQueryMobile，则会在页面转换时出现丑陋的页面过渡效果，因此，如果您的表单在对话框中，并且提交表单会关闭对话框，请确保将对话框转换（从上一个屏幕打开时）设置为“none”。

- Wytze

---

我无法在HTC G2 Android版本2.3.4上使用width: 0来隐藏输入。但是，我可以使用background-color: transparent;来隐藏它，并使用-webkit-tap-highlight-color: rgba(255,255,255,0);来隐藏令人讨厌的橙色Android焦点边框。https://dev59.com/1G435IYBdhLWcg3wyzQJ。 - Bobby

有点取巧但很有用！我通过设置 position: absolute 来隐藏输入。 - maGo

请查看下面的非hacky答案：https://dev59.com/iGox5IYBdhLWcg3wYzfX#20253746 - ykay says Reinstate Monica