Question

我有一个包含多个iframe的页面。所有iframe都引用同一页面。每个iframe页面都包含我要提交给服务器的表单。页面上有一个“全部提交”按钮，其中包含点击时调用此功能的iframe：

    function submitAll() {
    var fs = d3.selectAll('iframe')[0];
    for (var i = 0; i < fs.length; i++) {
        try {
            var el = fs[i];
            var doc = el.contentDocument;
            var root = el.contentWindow['root'];
            var f = doc.getElementById('submit-form');
            removeParentNodeReference(root);
            doc.getElementById('POST-name').value = document.getElementById('name').value;
            doc.getElementById('POST-email').value = document.getElementById('email').value;
            doc.getElementById('POST-phone').value = document.getElementById('phone-number').value;
            doc.getElementById('POST-json').value = JSON.stringify(root);
            doc.getElementById('POST-submit-info').click();
        }
        catch (e) {
            console.log(e.message);
        }
    }

该函数从每个iframe中获取内容文档。使用iframe的文档，它将继续在iframe页面中填写表单的某些表单值。然后，该函数将获取表单的按钮并单击它。这会调用iframe中的一个函数来执行某些处理并提交表单。

在Chrome中，提交了所有iframe的表单。但是，在firefox中，表单提交只会发生在第一个表单中。我已经进入调试器并看到即使它循环遍历所有iframe页面，实际上只发生了一次提交。

有人有什么想法吗？

感谢。

Answer 1

您可以使用Ajax代替使用iframe，而无需设置多个iframe。 Ajax允许您向页面发出请求，以获取其内容或提交数据。

实施例

在这个例子中，我将使用jQuery，它具有比纯javascript更简单的语法来执行此操作。确保在页面中包含jQuery，以便工作。

由于我不知道您定义提交数量的方式，我假设您将其作为参数提供给以下函数：

function submitAll(n){
    /* Get the values from your form
       --> they need to have the same name as in
       your php code (e.g "POST-name", etc) */
    var values = $("#myForm").serialize();

    /* Submit them n times */
    for(var i = 1; i <= n; i++){
        $.ajax({
            url: "yourpage.php",
            type: "post", // or get
            data: values, // declared above
            success: function(){
                console.log("Request "+i+"/"+n+" sent successfully.");
            },
            error: function(){
                console.log("Request "+i+"/"+n+" failed.");
            }
        });
    }
}

很高兴知道

Ajax是异步的，这意味着当ajax请求等待服务器的回答时，位于它之后的javascript代码会一直执行。例如，如果您将此行放在函数的末尾：

console.log("End of submitAll");

可能会在收到任何n个回复之前执行。

我希望这会有所帮助，如果您尝试这个并遇到问题，请告诉我们。

Answer 2

我遇到了同样的问题。我通过在iframe（notsendiframe）中添加一个类来解决它。 if（$（＆＃34; .notsendiframe＆＃34;）。length）{ //重命名iframe的类 //发送第一个iframe $（＆＃34; .notsendiframe＆＃34;）[0] } 在iframe的发布页面中，我添加了一个JS，它再次从父级启动JS。（所以下一个iframe将被发送）也许您需要先提交iframe，然后再提交。

在Firefox中从多个iframe提交表单

2 个答案:

实施例

很高兴知道