form表单焦点在输入按enter自动刷新页面

案发现场

就是这个搜索框，我鼠标键入输入框的时候然后按鼠标上的enter键竟然会自动提交表单并刷新页面！

事故分析

1、一开始我以为是后面那个button按钮的锅，因为我用的type="submit"，然后我就把这个按钮改成type="button",但是，这并没有什么卵用，所有我觉得问题不是出在这。
2、后面我就网上百度查原因，然后让我找到了另一种可能：当表单中只有一个input输入元素时，点击enter键，form表单会自动提交。 看到这个我就有点怀疑了，然后根据解决方法试了一下。

解决

//第一种
<form onsubmit="return false">
    <input type="text" name="test"/>
</form>
//第二组 多加一个input，并设置为display:none
<form >
    <input type="text" name="test" style="display:none"/>
    <input type="text" name="test"/>
</form>

真相大白

在使用了上诉两种方法后，我发现这两种方法都能解决我的问题，所以我觉得事故原因就是上诉第二种，同时解决方法也是上诉这两种，其他的我就不知道了。over