按回车键自动提交表单的问题

一次偶然的操作，在编辑页面，发现只要输入内容，按enter键，页面立马就跳转，有点意思。肯定enter键触发了表单提交。

在一个form表单中，若只有一个input，按回车键表单会自动提交，但是当表单中存在多个input时，按回车键不会执行任何操作，所以这个bug也是很有意思的。从网上查找资料，发现很多人遇到了这个有趣的问题。在此整理一下，做个记录，顺便分享一下。

出现自动提交的情况，有两种可能：
    一 、编写了javascript代码，当用户点按Enter键时，通过js事件侦听机制触发表单的提交。
    二 、浏览器在解析网页的时候，有许多默认的行为，例如如果一个页面上有表单和一个提交按钮，那么打开页面时，焦点会自动落在这个提交按钮上面。同样如果一个表单中只有一个单行文本输入域（text），那么在这个输入域中按Enter键时，浏览器会自动提交该表单。

解决的办法也有多种，整理如下：

方法一：直接对input进行操作，强行将回车键操作去掉：增加 onkeydown='if(event.keyCode==13) return false;'

<label>文档名称：<input name="Name" style="width: 400px;" value="@Model.Name" class="form-control" required onkeydown='if(event.keyCode==13) return false;'/></label>

方法二：直接在form上加上onsubmit="returnfalse;"这段话，它会阻止表单的回车键进行提交。

<form id="editform" method="post" class="form-inline" onsubmit="return false;">

方法三：很多人估计都想到过，就是既然一个input会自动提交，多个input就没问题，那么我给它多加一个input不就行了，有些人试过发现不行，那是为什么呢？因为他是这么写的<input type="hidden">，这样当然不行，一个隐藏域，type并不是text，所以不行。但是，<input type="text"style="display:none;">，使用这种方法就可以了，因为它是用样式隐藏输入框的，实质上还是一个type为text的input。