起因
业务场景为一个type=text的表单元素，通过ajax进行搜索。但是遇到一个bug，就是在输入之后按回车，就会自动提交表单。查找之后发现了浏览器的表单提交特性
如果只有一个text表单元素，回车会自动提交表单！！
为了避免这种bug，将表单回车后提交的场景都测试了一遍。
场景一：只有一个type=text表单元素
<form action="http://blog.600km.xyz"> <input type="text" name="username" /> </form>
在此场景下，只要在input中按下回车键，就会自动提交表单。 为了避免自动提交，可以设置一个隐藏的text元素，如
<form action="http://blog.600km.xyz"> <input type="text" style="display:none" /> <input type="text" name="username" /> </form>
场景二：有n个type=text和一个type=submit表单元素
<form action="http://blog.600km.xyz"> <input type="text" name="username" /> <input type="text" name="password" /> <input type="submit" value="Submit!" /> </form>
在此场景下，只要在input中按下回车键，就会自动提交表单。 为了避免自动提交，网上常见的例子是在form表单中监听onkeydown事件，如果是回车输入，则返回false，阻止表单提交。
<form action="http://blog.600km.xyz" onkeydown="if(event.keyCode==13){return false;}">
<input type="text" name="username" />
<input type="text" name="password" />
<input type="submit" value="Submit!" />
</form>但是这种写法存在1个问题：如果是textarea，可能会需要回车操作。
为了解决上述问题，需要增加针对textarea的判断条件，而且还要注意兼容ie。
<script type="text/javascript">
document.onkeydown = function(event) {
event = event || window.event;
var param = event.target || event.srcElement; // if (param.name=="username"){return true;}
if (event.keyCode == 13) {
if ("INPUT" == param.tagName) {
return false;
}
}
};
</script>
<form action="http://blog.600km.xyz">
<input type="text" name="username" />
<input type="text" name="password" />
<textarea name="introduction">
</textarea>
<input type="submit" value="Submit!" />
</form>根据if (param.name=="username"){return true;}就可以自定义在某个表单元素中，点击回车键，就可以提交表单。
场景三：有n个type=text，没有type=submit元素
此时点击回车键时，表单不会提交。可以通过监听onkeydown事件，利用submit()方法，根据keyCode和tagName或者表单元素的name来自定义提交规则
<script type="text/javascript">
document.onkeydown = function(event) {
event = event || window.event;
var param = event.target || event.srcElement;
if (event.keyCode == 13 && param.name == "password") {
document.getElementById("entityForm").submit();
}
};
</script>
<form action="http://blog.600km.xyz" id="entityForm">
<input type="text" name="username" />
<input type="text" name="password" />
<textarea name="introduction">
</textarea>
</form>场景四：有n个type=text和一个button标签元素
button标签，如果未指定type，则在ie6和ie7下为type="button"， 在ie8及chrome和火狐下为type="submit"，为了避免这种混乱，button标签一定要指定type。 如果指定为type="button"，则和场景三的处理方式一致， 如果是type="submit"，则同场景二。
结语
ie的特性让web开发者抓狂，本来很多浏览器自身属性可以方便解决的问题，都需要重新造一个轮子，达到浏览器兼容。 制造轮子和规则，为了规避约定或者隐藏特性带来的不可预知的麻烦。