点击' Go'停止表单提交在手机上

时间:2014-04-01 10:51:14

标签: javascript html .net forms mobile

有没有办法将按钮链接到输入,因此当您在.NET上下文中按键盘上的NextGo时,手机会知道该怎么做(即按下'在输入上点击下一步按钮而不是提交表单?

让我们的谈话代码一秒钟。我有以下标记,其中injected-via-js通过javascript注入大表格(渐进增强)。

<form class="dotNET-form-wrapper">
    <div class="injected-via-js">
        <div>
            <span>&pound;</span>
            <input type="number" />
        </div>
        <div>
            <button>accept</button>
        </div>
    </div>

    <!-- More form elements -->
</form>

在大多数移动浏览器中,当您更改数字输入中的值并按GoEnter时,它会按下按钮(在我的情况下,它会绑定一个重要事件)。但是在某些旧的Android设备上,按Go会提交表单,而就是我想要的。澄清:我希望Go按钮假按下按钮,而不是提交表单

注意: .NET仅与此问题相关,因为所有都包含在表单中,这意味着我无法在输入和按钮周围创建单独的表单并且劫持新表单的提交。

我已经创建了一个JSBin,我可以使用Android 2.2手机复制此错误,尽管我认为它也存在于其他糟糕的浏览器中。它在iOS 6+Android 2.3+上按预期工作。

这是演示页面:http://jsbin.com/tebizoda/2

以下是编辑版本:http://jsbin.com/tebizoda/2/edit

1 个答案:

答案 0 :(得分:2)

“Go”和“Enter”都有类似键盘输入的键码(13),所以你应该只创建一个JavaScript或jQuery函数来覆盖默认行为,然后触发按钮按下。像(jQuery中的例子):

$(your_form_or_input).keypress(function (e) {
  if (e.keyCode == 13) {
    return false;
  } else {
    // your code here...
  }
});

请注意,有些浏览器会使用e.keyCode,其他浏览器会使用e.keyCode确定按下的密钥代码。