Question

我有HTML两种形式，一种是在使用PHP进入数据库时提交数据，另一种是将用户引导到PayPal支付页面，我的问题是用户必须提交两种形式，当然我不会希望他们必须这样做。反正有两个表单使用一个提交按钮吗？

（欢迎使用Javascript）

Answer 1

您应该可以使用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();
}

Answer 2

表单提交会导致页面导航到表单的action。因此，您无法以传统方式提交两种表单。如果您尝试通过在每个表单上连续调用form.submit()来使用JavaScript，那么除了上次提交之外，每个请求都将被中止。因此，您需要通过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();

Answer 3

您可以使用AJAX提交第一个表单，否则提交一个表单将阻止另一个表单的提交。

Answer 4

在Chrome和IE9中（我猜测所有其他浏览器）只有后者才会生成套接字连接，第一个将被丢弃。（浏览器检测到这一点，因为两个请求都在上面的代码中的一个JavaScript“时间片”内发送，并丢弃除最后一个请求之外的所有请求。）

如果你有一些事件回调做第二次提交（但在收到回复之前），第一个请求的套接字将被取消。这肯定无需推荐，因为在这种情况下服务器可能已经处理了您的第一个请求，但您永远不会确定。

我建议您使用/生成一个可以在服务器端进行交易的请求。

Answer 5

目前选择的最佳答案太模糊，不可靠。

这对我来说是一种相当安全的方式：

（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 ？）。

我没有测试代码。

Answer 6

如果您想通过一个按钮提交两个表单，则需要执行此操作：

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不会同时提交两个表单。我们提交了两个表单，其中一个按钮不是同时但是在发布之后。

编辑：当我们使用此代码时，浏览器不允许弹出。
如果你像我这样的软件使用这个代码只是设置浏览器弹出show，但如果你在设计网站时使用它，浏览器是一个障碍，代码不会运行。

Answer 7

如果你有一个常规的提交按钮，你可以添加一个onclick事件来执行以下操作：

document.getElementById('otherForm').submit();

用一个按钮提交两个表格

7 个答案: