Question

我正在尝试使用javascript同时提交2个表单。但是，似乎只有第二次提交被打开，而不是第一次提交。

代码非常简单：

<html>
<body>
<form id="report_0" method="POST" target="_blank" action="https://www.google.com">
   <input type="hidden" name="test1" value="1">
   <input type="submit" value="report_0">
</form>
<form id="report_1" method="POST" target="_blank" action="https://www.google.com">
   <input type="hidden" name="test2" value="2">
   <input type="submit" value="report_1">
</form>
<script>
    document.getElementById("report_0").submit();
    document.getElementById("report_1").submit();
    </script>
</body>
</html>

我不能使用ajax或等价物，因为它必须是'原生'POST（由于CORS问题）

我在某处读到你不能同时提交两份表格，这对我来说没有意义。我已经尝试将目标从“_blank”改为“form1”＆amp; “form2”但仍然没有。

我们非常感谢您的协助：）

修改

以下是我实际使用的内容：

for (....) {
       var form = document.createElement("form");
       form.setAttribute("name", "report_"+i);
       form.setAttribute("method", "POST");
       form.setAttribute("target", "_blank");
       form.setAttribute("action", action);

       for (var key in parms) {
           var field = document.createElement("input");
           field.setAttribute("type", "hidden");
           field.setAttribute("name", key);
           field.setAttribute("value", parms[key]);
           form.appendChild(field);
       }
       console.log(form);
       document.body.appendChild(form);
       form.submit();
       document.body.removeChild(form);
}

Answer 1

这不是最漂亮的方式，但我认为无论如何分享它会很好。我最终使用setTimeout：

解决了这个问题

var requestDelay = 2000;
document.getElementById("form-a").submit();

setTimeout(function() {
    document.getElementById("form-b").submit();
}, requestDelay);

这样，它等待form A（可能，估计为2秒）已提交，然后提交form B。您可能需要使用requestDelay来满足您的需求。

Answer 2

你不能这个方式。提交表单时，整个页面被“销毁”，表单的响应作为新页面加载。

JavaScript代码运行单线程，所以基本上你一次触发两个表单上的submit事件，只有当你的JS完成后，浏览器再次接管并尝试执行你给它的任务队列。

因此，如果您想以非AJAX方式“正常”提交两个表单，则必须：

以某种方式将第二个表单的值存储在客户端上（cookie，localstorage，您将其命名）
提交第一个表单，其中的页面看起来完全相同，只有内容中某处有某些触发器，以便您的JS代码看到第一个表单已经提交。
将值还原到第二个表单（服务器不知道那些，因为它们尚未提交）
提交第二张表格。

Answer 3

表单提交是对服务器的同步调用（HttpRequest）。因此，第二种形式无法提交。您期望提交多个表单，而不是异步地依赖另一个表单。因此，像AJAX这样的API将解决这个问题，但你并不是在寻找它。

如果您的设计允许您在页面中保留多个框架/ iframe，请将这些表单保留在不同的框架/ iframe中。使用此方法，您可以从父页面提交多个表单。

如果您可以解释一次提交多个表单的要求以及您的限制，您可能会得到更好的响应。

Answer 4

我们可以用syn / asyn方式实现，请参考以下链接和示例示例....我希望这对您有帮助。

http://yogendrakrsingh.blogspot.in/2010/03/javascript-trick-submitting-multiple.html

或

在序列化的帮助下，mwe可以实现对第三个隐藏的帮助。这已经发布了，请在链接下面

Is to possible to submit two forms simultaneously?

使用JavaScript同时提交2个表单

4 个答案: