表格有两个输入没有提交？ [英] Form with two inputs not submitting?

问题描述

有人可以解释为什么这段代码不起作用：

Could someone please explain why this code isn't working:

$('form').on('submit', function (e) {
    e.preventDefault();

    var first = $('.first').val();
    var next = $(".next").val();
    alert(first + " " + next);
});

http://jsfiddle.net/cj1hysf3/

当我删除两个输入中的一个然后让它们两个混乱时似乎工作正常起来。

It seems to work fine when I remove one of the two inputs but having them both there messes it up.

推荐答案

您需要一个提交按钮。如果你愿意，你可以隐藏它，但是默认情况下输入提交表格，它需要在那里。

You need a submit button. You can hide it if you want but for enter to submit a form by default, it needs to be there.

$('form').on('submit', function (e) {
    e.preventDefault();

    var first = $('.first').val();
    var next = $(".next").val();
    alert(first + " " + next);
});

input[type="submit"] {
  display: none;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<form>
    <input type="text" name="a" class="first" placeholder="Enter First" />
    <input type="text" name="s" class="next" placeholder="Enter Next" />
    <input type="submit" value="submit" />
</form>

来自W3C ：

如果表单没有提交按钮，那么如果表单有多个字段，则隐式提交机制必须不执行任何操作阻止隐式提交，并且必须从表单元素本身提交表单元素。

"If the form has no submit button, then the implicit submission mechanism must do nothing if the form has more than one field that blocks implicit submission, and must submit the form element from the form element itself otherwise."

出于上一段的目的，元素是字段，如果表单元素的表单所有者是表单元素且其type属性处于以下状态之一，则阻止表单元素的隐式提交：Text，[...]

"For the purpose of the previous paragraph, an element is a field that blocks implicit submission of a form element if it is an input element whose form owner is that form element and whose type attribute is in one of the following states: Text, […]"

这篇关于表格有两个输入没有提交？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！