当表单具有“提交”输入时，从输入（文本）字段中点击“输入”答案

【问题标题】：Hitting "enter" from an input (text) field when a form has a "submit" input当表单具有“提交”输入时，从输入（文本）字段中点击“输入”
【发布时间】：2011-04-16 05:20:54
【问题描述】：

我试图找出与this old question from last year 描述的行为有关的事情。我有一个带有单个输入文本字段和一个“提交”按钮的表单。与提出该问题的人不同，我希望在用户点击“输入”时提交表单。确实，这对我有用；然而，不起作用的是导致表单中的“提交”输入被虚拟点击的怪癖：Firefox 和 Chrome 在发布的参数中包含“提交”输入的名称，而 IE 没有。换句话说，我希望这种古怪的提交行为能够发布文本输入字段，以及提交输入。

有趣的是，在我最近引入的一些神秘变化之前，我的表单就是这样做的。（Firefox 和 Chrome 仍然有效，但 IE 曾经有效，现在无效。）我可能可以弄清楚我改变了什么来破坏它，但是@bobince 似乎理解了这个怪癖，我想我会问看看如果有已知的（甚至可能记录在案的）方法来控制它。

这是我的测试页面：http://gutfullofbeer.net/post.html

这是我能做的最简单的测试：

<!DOCTYPE html>
<html>
  <body>
    <form name='foo' action='cgi/echoparams.cgi' method='post'>
      <input type='text' name='name' value=''>
      <input type='submit' name='submit_button' value='Submit'>
    </form>
  </body>
</html>

cgi 脚本只是模仿发布的内容。

【问题讨论】：

为什么需要包含按钮？如果您需要发送一些信息，请使用隐藏字段。
我可以绝对使用隐藏输入，事实上我开始这样做了。然后我尝试了一个较旧的系统安装，发现由于某种原因，该机制过去使用 IE 在该页面上工作过，所以我很好奇为什么会这样。

标签： javascript html forms submit

【解决方案1】：

是的，抱歉，它不能直接修复。我不知道您之前的“工作”案例是什么，但我怀疑可能存在额外的输入。（只有在单个文本输入时才会发生异常行为。）

对于默认提交按钮是否“成功”这一问题的历史挖掘，最好不要依赖它。添加隐藏输入以表示提交并省略提交按钮上的name。将任何提交脚本放在form onsubmit 而不是默认按钮上。

如果您有其他提交按钮用于不同的操作（例如，编辑与删除），则使第一个按钮执行“默认”操作并且不设置名称，然后添加覆盖默认值的 name/values其他按钮的行为。如果单击，这些肯定会“成功”（并将收到click 事件）。

【讨论】：

好吧，听起来不错。一旦我读到另一个问题，我就知道它很古怪，但我只是好奇。如果我弄清楚以前是什么使它起作用，我会更新问题或在某处添加评论。谢谢！

【解决方案2】：

我只是偶然发现了这种奇怪的行为。我有一种情况，其中提交了按钮的名称属性值和value，另一种情况是，我的 POST 数据中缺少按钮标签的名称和值属性。

（我用的是<button ...>-tag，不过好像没关系。）

折腾了半天，终于找到了解决办法，所以注册了告诉大家。

IE7和IE8开始提交当前按钮标签的name和value，以防第二个<input type="text">标签。如果页面中只有一个<input type="text">，并且您在此输入字段中按回车键，则缺少按钮的name 和value。

单选按钮、复选框、隐藏输入...没关系，您需要第二个<input type="text"> 来解决此问题。

【讨论】：