javascript - 在 iframe 中提交的表单在某些计算机上失败

Question

使用函数在单独的 iframe 中提交 2 个表单，然后在父页面上提交一个表单。(奇怪的问题是)我的方法似乎在一台计算机上运行正常，在其他计算机上它只在父页面上提交表单。浏览器是相同的(firefox，相同版本)。我想知道为什么会发生这种情况以及如何解决这个问题。这是 html 和函数

   <form id="projects" method="post">
    ...
    <input type="submit" class="button-primary" value="" >
    </form>
    <iframe id="lean">...<form method="post"><input type="submit" class="button-primary" value="submit" ></form></iframe>
    <iframe id="lean2">...<form method="post"><input type="submit" class="button-primary" value="submit" ></form></iframe>
    <button if="herewego">Submit all</button>

js

$(window).load(function(){
$('#herewego').click(function(){
if ($("#lean").contents().find("#_dtm_first_name").val().length >= 1){
$("#lean").contents().find('.button-primary').click();}
if ($("#lean2").contents().find("#_dtm_first_name").val().length >= 1){
$("#lean2").contents().find('.button-primary').click();}
$('#projects').find('.button-primary').click();
});

父页面中的表单重定向。我的理论是，在过载的浏览器上，有足够的时间在 iframe 内提交表单，而在负载较少的浏览器上，它发生得如此之快，只有父级中的表单被提交。是这种情况吗？如果是，我应该如何重组我的 js，以便两个 iframe 表单都在父页面表单之前提交？

Answer 1

Javascript是异步的，所以如果你想先提交iframe表单，你需要依赖回调函数。有趣的是，JQuery 的 click() 函数似乎没有回调机制，因此您需要找到一些其他“标志”作为引用，例如，使用 iframe 表单提交事件怎么样？您可以确保仅在调用其他两个 onSubmit() 函数后提交父表单(您可以使用计数器或其他东西......)。

解决这个问题的另一种可能是过度设计的方法是使用 JQuery 的 $.when，我之前用过它来保证涉及 Ajax 调用的同步事件，但不能 100% 确定是否这对你的情况有用，但这是一个很酷的技术:)

var deferreds = getSomeDeferredStuff();

        $.when.apply($,deferreds).done(
            function() {
                //Only execute this block after the iframe forms are submitted
                console.log('Success!');

                submitParentForm();

            }).fail(function() {
                // Oh noes, something went wrong :(
                console.log('The process failed');          
            }
        );

function getSomeDeferredStuff() {
    var deferreds = [];

    deferreds.push(submitIframeForm1());
    deferreds.push(submitIframeForm2());

    return deferreds;
}