jQuery，阻止表单提交输入但允许表单通过按钮单击提交

Question

这个问题已经有答案了:

Prevent users from submitting a form by hitting Enter (36 个回答)

已关闭 7 年前。

我有一个表单，在输入文本框中输入一个数字并按 ENTER 键，然后使用 jQuery 将值附加到文本区域。这一切都运行良好。

我遇到的问题是，如果我添加一个提交按钮来提交表单，那么只要我按 ENTER 键，它就会提交表单。

我想要它做的不是按 Enter 时提交表单，而是仅在单击提交按钮时提交表单。

我尝试使用 PreventDefault() 并返回 false，这将在按 ENTER 时停止提交表单，但如果我在提交按钮上添加单击事件来提交表单，它不会执行任何操作。我在提交之前在点击函数中放置了一个警报，该警报会触发，但表单不会提交

<form id="toteform" method="post" action="blah.php">
    <input type="text" name="bin" id="bin" maxlength="4" autocomplete="off" />

    <input type="text" name="totes" id="tote" maxlength="4" autocomplete="off" />

    <input type="button" name="submit" class="submit" id="submit" value="Submit" />
</form>

jQuery

$("#submit").click(function() {
    $('#toteform').submit();
});

$('#bin').focus();

$('#bin').keypress(function(e) {
    if(e.which == 13) {
        $('#tote').focus();
    }
});

$('#tote').keypress(function(e) {
    if(e.which == 13) {

    // more code here to do other things

Answer 1

请小心使用e.originalEvent.explicitOriginalTarget.id 方法。它仅适用于 Gecko based browsers .

相关answer .

本可以使用评论，但我没有足够的声誉:(