Javascript 在keyup上使用submit（）提交表单两次

我有一个类似于以下内容的jQuery/HTML代码：

<form action="/SomeAction" method="post">
  <input id="my-textbox" type="text" placeholder="Write something and press enter to continue..." />
</form>

<script type="text/javascript">
 $(function() {
     $('#my-textbox').keyup(function(e) {
        var $textbox = $(this);
        if ($textbox.val().length > 0 && e.keyCode == 13) {
           $textbox.parent('form').submit();
        }
     });
 });
</script>

$（函数（）{
$（“#我的文本框”）.keyup（函数（e）{
var$textbox=$（此）；
如果（$textbox.val（）.length>0&&e.keyCode==13）{
$textbox.parent（'form'）.submit（）；
}
});
});

其目的是在用户按下Enter键时自动提交表单。我经常使用Firefox，所以在我使用Google Chrome和Internet Explorer进行测试之前，一切都正常

当我在以后的浏览器中按Enter键时，有时我会提交两次表单。这很容易被注意到，因为我会在数据库中得到重复的条目，我会看到两个

POST

s使用Fiddler

经过一些测试，我发现我的问题是jQuery代码，因为文本框在没有它的情况下会在enter时自动提交，并且在某些浏览器中使用此代码会生成第二个

POST

我的问题是：

为什么浏览器不聪明地阻止第二个表单post（就像Firefox在我的测试中所做的那样）

我是否应该在所有平台的所有主要浏览器中都看到这种行为

---

有没有办法改进这段代码，让我使用JavaScript执行提交，但不要让表单提交两次？

添加布尔变量，该变量将在首次提交后设置为true，并在if条件下使用该变量。这将防止意外双击

您还应该防止在应用程序后端进行双重提交（许多web框架都有内置的机制来实现这一点，定制解决方案也很容易）

为什么浏览器不聪明地阻止第二个表单post（就像Firefox在我的测试中所做的那样）

这是默认行为。如果您没有脚本，并且默认行为是表单不会在enter上发布，该怎么办

我是否应该在所有平台的所有主要浏览器中都看到这种行为

对

有没有办法改进这段代码，让我使用JavaScript执行提交，但不让表单提交两次

---

使用全局

mutex

变量，并在表单发布后设置它-在后续发布中检查它以进行验证。或者，从

keyup

处理程序返回false并停止事件传播。

如果表单中只有一个按钮，则某些浏览器会将输入按钮解释为提交。只需在函数中

返回false

，即可防止默认行为提交表单

if ($textbox.val().length > 0 && e.keyCode == 13) {
    $textbox.parent('form').submit();
    return false;
}

---

您的表单将在按下enter键之后提交（在按下键时，在启动键之前），以便您可以执行以下操作

$(function() {
    $('#my-textbox').keydown(function(e){
        if(e.keyCode==13) e.preventDefault();
    }); 

    $('#my-textbox').keyup(function(e) {
        e.preventDefault();
        var $textbox = $(this);
        if($textbox.val().length > 0 && e.keyCode == 13) {
           $textbox.parent('form').submit();
        }
     });
 });​

---

尝试阻止默认事件。您将在keyup上提交表单。每次文本字段中出现keyup事件时，您都会请求JavaScript提交表单。你得到的正是你想要的。我不是jquery专家，但我会将你的代码挂接到表单中的submit事件（或挂接阻止其默认行为的函数）@EvikJames not true。只有当字段不为空且按下的键是enter键时，他才提交表单。仔细看看。我如何在不使用键盘的情况下提交表单？例如，单击以获得焦点，语音识别以输入文本和。。。什么？我试过了，但我还是收到了两个表单帖子：一个来自我的代码，一个来自浏览器的默认事件。他在keyup中这样做，所以现在阻止默认已经太晚了。见@Sheikh的例子。不正确@Hexxagonal我只看到Chrome18和IE8中的一篇文章，所以我无法验证你的测试。