当用户按下回车键或者Enter键时，如何阻止表单提交？

Question

我有一个使用JQuery的表单，我不认为需要在这篇文章中放置代码，问题相当基础。

但是我希望在人们按下回车键或返回键时阻止表单提交。

同时，我有文本区域，在那里用户需要能够按下回车/返回键。

- William Koplitz

---

一个很好的折中方案可能是实现客户端验证。如果用户按下回车键，而验证失败，表单将无法提交。如果他们按下回车键，而验证成功，即使这是一个意外，表单也会提交，但至少你保留了默认的浏览器行为。 - colllin

Answer 1

一个快速而粗糙的解决方法，但通常比尝试在每个字段中阻止按键更可靠：添加：

<input type="submit" onclick="return false;" />

在表单的顶部。在当前浏览器中，表单中的第一个提交作为默认按钮，因此通过去除它，可以防止按Enter键提交表单。

然后使用CSS隐藏和/或移动按钮，以便它无法被看到。

然而，并不总是明智禁用按Enter键提交表单；这是浏览器预期工作的标准方式，有些用户确实需要它。

- bobince

---

谢谢，这就是我想要的。我明白干扰正常浏览器操作并不是一个好主意，但有时你只能按照客户的要求去做... - William Koplitz

Answer 2

你可以尝试这个。

jQuery(document).ready(function(){
   validSubmit = false;
})

jQuery('myForm textarea').keypress(function(e) {
   if (e.which == 13) {
      validSubmit = true; // if the pressed key is enter, then allow submissions
   }
})

jQuery('myForm').submit(function(){
   if (!validSubmit) {
      return false;  //if submitting the form is not allowed, then cancel submission
   }
})

这将取消所有提交，除非在文本区域上按下回车键。如果您使用的是按钮，则还需要为其添加一个函数。

jQuery('form button.validSubmit').click(function(){  //or 'form input[type="submit"]'
   validSubmission = true;
})

- Mike

Answer 3

在文档级别设置一个标志，submitform = false; 验证提交是否符合此标志。在提交按钮的onclick处理程序中更改标志。

- Devin Ceartas

Answer 4

你能否在表单中添加一个onsubmit属性，然后检查是否使用回车键提交？

- SeanJA