问题产生的原因

input里按回车键会刷新页面怎么办

很多时候我们在使用网页的时候，在表单的输入框内按回车都会刷新页面，这让人很困扰。这种现象是为什么？要怎么解决？

input按回车键刷新页面，一般有两种原因，一是<form>表单有button，二是<form>表单里无button，只有一个input输入框。

这种情况下，按回车键刷新页面是因为button是用来提交表单的，而回车键的默认行为也是提交表单，因此回车键会触发button的点击事件，从而导致表单被提交。

要解决这个问题，可以将button的type属性设置为"submit"，这样button就不会被回车键触发了。

<form>
  <input type="text" name="name">
  <button type="submit">提交</button>
</form>

在这种情况下，按回车键刷新页面是因为input输入框也是可以提交表单的，而回车键的默认行为也是提交表单，因此回车键会触发input输入框的提交事件，从而导致表单被提交。

要解决这个问题，可以将input输入框的type属性设置为"text"或"password"，这样input输入框就不会被回车键触发了。

<form>
  <input type="text" name="name">
</form>

除了以上方法，还可以使用以下方法来解决input按回车键刷新页面问题：

• 在<form>表单中添加onsubmit事件处理函数，并在事件处理函数中阻止表单的提交。
• 在<input>输入框中添加onkeydown事件处理函数，并在事件处理函数中判断回车键是否被按下，如果回车键被按下，则阻止表单的提交。

input按回车键刷新页面，一般有两种原因，一是<form>表单有button，二是<form>表单里无button，只有一个input输入框。要解决这个问题，可以将button的type属性设置为"submit"，也可以将input输入框的type属性设置为"text"或"password"。还可以使用其他方法来解决这个问题，如在<form>表单中添加onsubmit事件处理函数，或在<input>输入框中添加onkeydown事件处理函数。