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();
});

父页面中的表单重定向。我的理论是，在重载的broswers上有足够的时间在iframe中提交表单，而在负载较少的浏览器上，它发生的速度非常快，只有父表单才能提交。是这样的，如果是这样，我应该如何重构我的js，以便在父页面表单之前提交两个iframe表单？

Answer 1

Javascript是异步的，因此如果您想首先提交iframe表单，则需要依赖回调函数。有趣的是，JQuery的click（）函数似乎没有回调机制，所以你需要找到一些其他的＃34; flag＆＃34;作为参考，例如，如何使用iframe表单提交事件？您可以确保仅在调用另外两个onSubmit（）函数后才提交父表单（您可以使用计数器或其他东西......）。

解决这个问题的另一种可能是过度设计的方法是使用JQuery＆＃39; $.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;
}

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

1 个答案: