为啥我的表单提交两次？
Posted
技术标签:
【中文标题】为啥我的表单提交两次？【英文标题】：Why is my form submitting twice?为什么我的表单提交两次？ 【发布时间】：2012-03-07 23:49:51 【问题描述】：所以由于某种原因，我的表单只需按下一个按钮就提交了两次。这是我第一次使用 jquery Form 插件，我想 jquery 提交一次，并且表单也是“自然”提交的。我已经看到补救措施是在表单的 onSubmit 事件处理程序上附加一个“return false”。我以为我正在这样做，但显然它不起作用。
谁能帮忙？
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title>User form entry </title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script src="jquery.validate.js"></script>
<script src="jquery.passwordStrength.js"></script>
<script src="jquery.form.js"></script>
<script>
$(document).ready(function()
$('#signupForm').ajaxForm(function()
var queryString = $('#signupForm').formSerialize();
$.post('process.php', queryString);
);
);
</script>
</head>
<body>
<form id="signupForm" action="process.php" onsubmit="return false" method="post">
<fieldset class="password">
... form goes here
<button type="submit" name="formSubmit" value="submit">Click to submit</button>
</form>
<div id="results"></div>
</body>
</html>
我尝试将 onsubmit="return false" 添加到表单元素，但是我根本没有提交。我也尝试过添加“return false;”到 jQuery，但我仍然有双重提交。我错过了什么？根据 jQuery Form Plugin 网站，这似乎是标准方法。我的表单有何不同？
（顺便说一下，我说的不是重复按下按钮连续提交多个表单的问题。我的问题是“一个提交按钮按下=两个提交”。）
【问题讨论】：
你的表单提交也是没有js的吗？ 我遇到了同样的问题，表单被提交了两次。 【参考方案1】：$('#signupForm').ajaxForm(function()
var queryString = $('#signupForm').formSerialize();
$.post('process.php', queryString);
);
这是提交两次......ajaxForm 方法一次，然后post() 第二次
ajaxForm 方法为您处理表单汇总...您不需要添加post() 方法...ajaxForm 内部的函数是一个回调，在成功时执行...
$('#signupForm').ajaxForm(function()
alert("Thank you for your comment!");
);
此代码将在成功发布后显示警报...这里的简单示例 -> http://jquery.malsup.com/form/
您还应该从表单中删除onsubmit 属性...
更新
如果你想显示结果...这样做：
$(document).ready(function()
$('#signupForm').ajaxForm( target: '#results' );
// this will output the responseText from the submitted form to the target DOM element
);
【讨论】：
我按照你说的方式调用 ajaxForm，但我仍然收到双重职位。一个区别是我在提交中进行文件上传。第一次调用上传处理程序时，HttpPostedFileBase 是正确的，第二次调用时，HttpPostedFileBase 什么都没有。我可以很容易地解决这个问题，但我宁愿不必这样做。【参考方案2】：避免使用
<button type="submit" name="formSubmit" value="submit">
所以很自然，您的提交按钮将执行一次提交，而您的 jquery 将执行另一次提交
使用这个
<input type="button" name="formSubmit" value="submit">
【讨论】：
如果你绑定到表单的onsubmit（并返回false），那么使用提交按钮就可以了。
当我使用按钮而不是提交时，表单根本不会提交。绑定到表单的 onsubmit 并返回 false 并不能缓解双重发布问题。
为什么要避免使用 type="submit"？【参考方案3】：
试试这个：
onsubmit="void(0);"
【讨论】：
他返回的是假的。这完全阻止了事件的传播。这段代码什么都不做，上面的代码将提交表单。发送表单两次是因为有人在这里回答了 $.post 电话。【参考方案4】：不要使用submit 按钮。使用常规按钮。
【讨论】：
如果你绑定到表单的onsubmit（并返回false），那么使用提交按钮就可以了。
有不止一种方法可以做到这一点。我的建议完全有效。
使用常规按钮根本不会提交表单。绑定到表单的 onSubmit 并返回 false 并不能缓解双重发布问题。以上是关于为啥我的表单提交两次？的主要内容，如果未能解决你的问题，请参考以下文章