[英]Submit two forms with one button
我有两种 HTML 表单,一种在使用 PHP 输入数据库时提交数据,另一种将用户定向到贝宝付款页面,我的问题是用户必须同时提交这两种形式,我当然不希望他们这样做必须做。 有没有办法为两个表单使用一个提交按钮?
(欢迎使用 JavaScript)
你应该可以用 JavaScript 做到这一点:
<input type="button" value="Click Me!" onclick="submitForms()" />
如果您的表单有 ID:
submitForms = function(){
document.getElementById("form1").submit();
document.getElementById("form2").submit();
}
如果您的表单没有 ID 但有名称:
submitForms = function(){
document.forms["form1"].submit();
document.forms["form2"].submit();
}
表单提交会导致页面导航到表单的action
。 因此,您不能以传统方式提交这两种表格。 如果您尝试使用 JavaScript 通过在每个表单上连续调用form.submit()
来执行此操作,则除了最后一次提交之外,每个请求都将被中止。 因此,您需要通过 JavaScript 异步提交第一个表单:
var f = document.forms.updateDB;
var postData = [];
for (var i = 0; i < f.elements.length; i++) {
postData.push(f.elements[i].name + "=" + f.elements[i].value);
}
var xhr = new XMLHttpRequest();
xhr.open("POST", "mypage.php", true);
xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhr.send(postData.join("&"));
document.forms.payPal.submit();
您可以使用 AJAX 提交第一个表单,否则提交一个将阻止另一个提交。
在 Chrome 和 IE9(我猜所有其他浏览器也是如此)中,只有后者会生成套接字连接,第一个将被丢弃。 (浏览器会检测到这一点,因为这两个请求都是在上面代码中的一个 JavaScript“时间片”内发送的,并丢弃除最后一个请求之外的所有请求。)
如果你有一些事件回调做第二次提交(但在收到回复之前),第一个请求的套接字将被取消。 这绝对没有什么值得推荐的,因为在这种情况下服务器可能已经处理了您的第一个请求,但您永远不会确定。
我建议您使用/生成一个可以在服务器端进行交易的请求。
当前选择的最佳答案过于模糊,不可靠。
这对我来说是一种相当安全的方法:
(Javascript:使用 jQuery 写得更简单)
$('#form1').submit(doubleSubmit);
function doubleSubmit(e1) {
e1.preventDefault();
e1.stopPropagation();
var post_form1 = $.post($(this).action, $(this).serialize());
post_form1.done(function(result) {
// would be nice to show some feedback about the first result here
$('#form2').submit();
});
};
发布第一个表单而不更改页面,等待该过程完成。 然后发布第二个表格。 第二个帖子将更改页面,但您可能希望为第二个表单也有一些类似的代码,以获得第二个延迟对象( post_form2 ?)。
不过,我没有测试代码。
如果你想一键提交两个表单,你需要这样做:
1-使用 setTimeout()
2-允许显示弹出
<script>
function myFunction() {
setTimeout(function(){ document.getElementById("form1").submit();}, 3000);
setTimeout(function(){ document.getElementById("form2").submit();}, 6000);
}
</script>
<form target="_blank" id="form1">
<input type="text">
<input type="submit">
</form>
<form target="_blank" id="form2">
<input type="text">
<input type="submit">
</form>
javascript 不会同时提交两个表单。 我们不能在同一时间,但secounds后,只需按动一个按钮提交两种形式。
编辑:当我们使用此代码时,浏览器不允许弹出。
如果您像我一样将此代码用于您的软件,只需将浏览器设置为显示弹出,但如果您在设计网站时使用它,浏览器是一个障碍,代码无法运行。
如果你有一个常规的提交按钮,你可以向它添加一个 onclick 事件,它执行以下操作:
document.getElementById('otherForm').submit();
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.