Question

我有一个带有单个submit输入的HTML表单，还有各种button元素。当用户按下“回车”键时，我希望它实际上提交表单，但是（至少在Chrome 15中）我发现它触发了第一个button（因为它发生在我认为HTML不是submit输入。

我知道，一般情况下，您无法强制浏览器支持特定的submit输入，但我真的认为他们会支持submit元素上的button输入。是否可以对HTML进行一些小的调整以使其工作，或者我将不得不采用某种Javascript方法？

以下是HTML的粗略模型：

<form action="form.php" method="POST">
    <input type="text" name="field1"/>
    <button onclick="return myFunc1()">Button 1</button>
    <input type="submit" name="go" value="Submit"/>
</form>

Answer 1

您不需要JavaScript来选择默认的提交按钮或输入。您只需要使用type="submit"标记它，其他按钮用type="button"标记它们。在您的示例中：

<button type="button" onclick="return myFunc1()">Button 1</button>
<input type="submit" name="go" value="Submit"/>

Answer 2

你可以使用jQuery：

$(function() {
    $("form input").keypress(function (e) {
        if ((e.which && e.which == 13) || (e.keyCode && e.keyCode == 13)) {
            $('button[type=submit] .default').click();
            return false;
        } else {
            return true;
        }
    });
});

Answer 3

试试这个，如果按了回车键，你可以像这样捕捉它，例如，我前几天开发了一个答案html button specify selected，看看这是否有帮助。

指定表单名称，例如yourFormName，然后您应该能够在不关注表单的情况下提交表单。

document.onkeypress = keyPress;

function keyPress(e){
  var x = e || window.event;
  var key = (x.keyCode || x.which);
  if(key == 13 || key == 3){
   //  myFunc1();
   document.yourFormName.submit();
  }
}

Answer 4

我刚刚遇到了这个问题。我将input更改为button并且我的帖子写得不好/>标签终止符号，这是一个不好的结果：

所以我有：

<button name="submit_login" type="submit" class="login" />Login</button>

刚刚将其修改为：

<button name="submit_login" type="submit" class="login">Login</button>

现在就像一个魅力，总是烦人的小事...... HTH

Answer 5

鉴于只有一个（或者这个解决方案甚至可能没有一个）提交按钮，这里是基于jQuery的解决方案，可以在同一页面上使用多个表单...

<script type="text/javascript">
    $(document).ready(function () {

        var makeAllFormSubmitOnEnter = function () {
            $('form input, form select').live('keypress', function (e) {
                if (e.which && e.which == 13) {
                    $(this).parents('form').submit();
                    return false;
                } else {
                    return true;
                }
            });
        };

        makeAllFormSubmitOnEnter();
    });
</script>

Answer 6

$("form#submit input").on('keypress',function(event) {
  event.preventDefault();
  if (event.which === 13) {
    $('button.submit').trigger('click');
  }
});

Answer 7

我只是在Chrome和Firefox以及IE10中都给了它一个旋转。

如上所述 - 确保您已标记type =“button”，“reset”，“submit”等，以确保它正确级联并选择正确的按钮。

也许还将它们全部设置为具有相同的形式（即所有这些对我有用）

在HTML表单上输入密钥而不是激活按钮

7 个答案: