Javascript/JQuery：在两个函数完成后重新加载页面

我有一个保存按钮，它调用一个函数来打开一个带有两个按钮的模式对话框；“保存时间线”和“取消”。“保存时间线”按钮调用两个函数，之后页面需要重新加载。我尝试了几种不同的方法来完成这件事

1只需实际调用函数： 2设置回调： 3使用JQuery$.when（）.do（）： 在所有三次尝试中，我的问题都是在单击“保存时间线”按钮时出现的。。。页面将重新加载，并且没有任何函数运行。当我从每个示例中提取location.reload（）调用时，函数会按照我的要求运行

是否有办法仅在功能完成后重新加载页面

以下是我调用的函数，仅供参考：

function saveTimelines() { 
    console.log("start save");
    for (i=1; i < timelineIndex + 1; i++) {
        var dow = startdow;
        var clientValue = $("#clientNameSelect" + i).val();
        var projectValue = $("#projectSelect" + i).val();
        var taskValue = $("#taskSelect" + i).val();
        var billingValue = $("#billingSelect" + i).val();
        var activityValue = $("#activitySelect" + i).val();
        var stateValue = $("#states" + i).val();
        var sundayValue = $("#sun" + i).val();
        var mondayValue = $("#mon" + i).val();
        var tuesdayValue = $("#tue" + i).val();
        var wednesdayValue = $("#wed" + i).val();
        var thursdayValue = $("#thu" + i).val();
        var fridayValue = $("#fri" + i).val();
        var saturdayValue = $("#sat" + i).val();



        $.ajax({
            type: "GET",
            url:"biqqyzqyr?act=API_DoQuery&query={'6'.EX.'" + projectValue + "'}AND{'16'.TV.'" + currUserEmail + "'}&clist=3&includeRids=1&fmt=structured",
            dataType: "xml",
            success: function (xml) {
                $(xml).find("record").each(function () {
                    var resourceMap = new Array();
                    $(this).children().each(function () {
                        var name = $(this).attr("id");
                        var value = $(this).text();
                        resourceMap[name] = value;
                    });
                    resourceRecords.push(resourceMap);
                });
                console.log("hi");
                var resourceRId = '3';
                for (var j = 0; j < resourceRecords.length; j++) {
                    resourceOptions = resourceRecords[j][resourceRId];
                    console.log(resourceOptions);
                }

                $.ajax({
                    type: "GET",
                    url: "biha4iayz?act=API_AddRecord&_fid_12=" + dow + "&_fid_36=" + clientValue + "&_fid_9=" + projectValue + "&_fid_7=" + taskValue + "&_fid_10=" + billingValue + "&_fid_15=" + activityValue + "&_fid_11=" + stateValue + "&_fid_13=" + sundayValue + "&_fid_57=" + mondayValue + "&_fid_58=" + tuesdayValue + "&_fid_59=" + wednesdayValue + "&_fid_60=" + thursdayValue + "&_fid_61=" + fridayValue + "&_fid_62=" + saturdayValue + "&_fid_17=" + resourceOptions,
                    dataType: "xml",
                    success: function () {
                        console.log(i+ "new")
                    },
                    fail: loadFail
                });

            },
            fail: loadFail
        });
    }

    alert(timelineIndex+savedTimelineIndex+" timelines have been saved to the system...");

}



function editSavedTimelines(callback) {
    console.log("start edit");
    for (j=1; j < savedTimelineIndex + 1; j++) {
        var dow = startdow;
        var savedRId = $("#recordsaved" + j).val();
        var sundayValue = $("#sunsaved" + j).val();
        var mondayValue = $("#monsaved" + j).val();
        var tuesdayValue = $("#tuesaved" + j).val();
        var wednesdayValue = $("#wedsaved" + j).val();
        var thursdayValue = $("#thusaved" + j).val();
        var fridayValue = $("#frisaved" + j).val();
        var saturdayValue = $("#satsaved" + j).val();

        console.log(savedRId);



     $.ajax({
        type: "GET",
        url: "biha4iayz?act=API_EditRecord&rid=" + savedRId + "&_fid_13=" + sundayValue + "&_fid_57=" + mondayValue + "&_fid_58=" + tuesdayValue + "&_fid_59=" + wednesdayValue + "&_fid_60=" + thursdayValue + "&_fid_61=" + fridayValue + "&_fid_62=" + saturdayValue,
        dataType: "xml",
        success: function () {

        },
        fail: loadFail
    });



}

}

函数saveTimelines（）{
console.log（“启动保存”）；
对于（i=1；i

这应该适合您。它为for循环中的for ajax调用使用一个延迟对象数组，并在所有这些调用完成时有一个最终的延迟对象。外部函数侦听这些延迟对象的完成情况。请注意，我已经剪掉了许多不相关的代码，并将ajax调用从成功回调改为

.done（）

function genSaveTimelinesModal() {
    $("#saveTimelineDialog").dialog({
        resizable: false,
        height: 250,
        modal: true,
        buttons: {
            "Save timelines": function() {
                $.when(editSavedTimelines(), saveTimelines()).done(function() {
                    location.reload();
                });
            },
            Cancel: function() {
                $(this).dialog("close");
            }
        }
    });
}

function saveTimelines() {

    var finalDef = $.Deferred();

    var defs = [];
    for (i=1; i < timelineIndex + 1; i++) {

        var def = $.Deferred();
        defs.push(def);

        $.ajax({...}).done(function(xml) {

            $.ajax({...}).done(function() {

                def.resolve(true);

            });

        });        
    }

    $.when.apply(null, defs).done(function() {
        finalDef.resolve();
    });

    return finalDef.promise();

}

function editSavedTimelines() {

    var finalDef = $.Deferred();

    var defs = [];
    for (j=1; j < savedTimelineIndex + 1; j++) {    

        var def = $.Deferred();
        defs.push(def);

        $.ajax({...}).done(function() {
            def.resolve(true); 
        });
    }

    $.when.apply(null, defs).done(function() {
       finalDef.resolve(true); 
    });

    return finalDef.promise();
}

函数genSaveTimelinesModal（）{
$（“#saveTimelineDialog”）.dialog({
可调整大小：false，
身高：250，
莫代尔：是的，
按钮：{
“保存时间线”：函数（）{
$.when（editSavedTimelines（），saveTimelines（））.done（函数（）{
location.reload（）；
});
},
取消：函数（）{
$（此）.dialog（“关闭”）；
}
}
});
}
函数saveTimelines（）{
var finalDef=$.Deferred（）；
var-defs=[]；
对于（i=1；i    function genSaveTimelinesModal() {
    $("#saveTimelineDialog").dialog({
        resizable: false,
        height: 250,
        modal: true,
        buttons: {
            "Save timelines": function() {
                $.when(editSavedTimelines(), saveTimelines()).do(location.reload());
            },
            Cancel: function() {
                $(this).dialog("close");
            }
        }
    });
}

function saveTimelines() { 
    console.log("start save");
    for (i=1; i < timelineIndex + 1; i++) {
        var dow = startdow;
        var clientValue = $("#clientNameSelect" + i).val();
        var projectValue = $("#projectSelect" + i).val();
        var taskValue = $("#taskSelect" + i).val();
        var billingValue = $("#billingSelect" + i).val();
        var activityValue = $("#activitySelect" + i).val();
        var stateValue = $("#states" + i).val();
        var sundayValue = $("#sun" + i).val();
        var mondayValue = $("#mon" + i).val();
        var tuesdayValue = $("#tue" + i).val();
        var wednesdayValue = $("#wed" + i).val();
        var thursdayValue = $("#thu" + i).val();
        var fridayValue = $("#fri" + i).val();
        var saturdayValue = $("#sat" + i).val();



        $.ajax({
            type: "GET",
            url:"biqqyzqyr?act=API_DoQuery&query={'6'.EX.'" + projectValue + "'}AND{'16'.TV.'" + currUserEmail + "'}&clist=3&includeRids=1&fmt=structured",
            dataType: "xml",
            success: function (xml) {
                $(xml).find("record").each(function () {
                    var resourceMap = new Array();
                    $(this).children().each(function () {
                        var name = $(this).attr("id");
                        var value = $(this).text();
                        resourceMap[name] = value;
                    });
                    resourceRecords.push(resourceMap);
                });
                console.log("hi");
                var resourceRId = '3';
                for (var j = 0; j < resourceRecords.length; j++) {
                    resourceOptions = resourceRecords[j][resourceRId];
                    console.log(resourceOptions);
                }

                $.ajax({
                    type: "GET",
                    url: "biha4iayz?act=API_AddRecord&_fid_12=" + dow + "&_fid_36=" + clientValue + "&_fid_9=" + projectValue + "&_fid_7=" + taskValue + "&_fid_10=" + billingValue + "&_fid_15=" + activityValue + "&_fid_11=" + stateValue + "&_fid_13=" + sundayValue + "&_fid_57=" + mondayValue + "&_fid_58=" + tuesdayValue + "&_fid_59=" + wednesdayValue + "&_fid_60=" + thursdayValue + "&_fid_61=" + fridayValue + "&_fid_62=" + saturdayValue + "&_fid_17=" + resourceOptions,
                    dataType: "xml",
                    success: function () {
                        console.log(i+ "new")
                    },
                    fail: loadFail
                });

            },
            fail: loadFail
        });
    }

    alert(timelineIndex+savedTimelineIndex+" timelines have been saved to the system...");

}



function editSavedTimelines(callback) {
    console.log("start edit");
    for (j=1; j < savedTimelineIndex + 1; j++) {
        var dow = startdow;
        var savedRId = $("#recordsaved" + j).val();
        var sundayValue = $("#sunsaved" + j).val();
        var mondayValue = $("#monsaved" + j).val();
        var tuesdayValue = $("#tuesaved" + j).val();
        var wednesdayValue = $("#wedsaved" + j).val();
        var thursdayValue = $("#thusaved" + j).val();
        var fridayValue = $("#frisaved" + j).val();
        var saturdayValue = $("#satsaved" + j).val();

        console.log(savedRId);



     $.ajax({
        type: "GET",
        url: "biha4iayz?act=API_EditRecord&rid=" + savedRId + "&_fid_13=" + sundayValue + "&_fid_57=" + mondayValue + "&_fid_58=" + tuesdayValue + "&_fid_59=" + wednesdayValue + "&_fid_60=" + thursdayValue + "&_fid_61=" + fridayValue + "&_fid_62=" + saturdayValue,
        dataType: "xml",
        success: function () {

        },
        fail: loadFail
    });



}

}

function genSaveTimelinesModal() {
    $("#saveTimelineDialog").dialog({
        resizable: false,
        height: 250,
        modal: true,
        buttons: {
            "Save timelines": function() {
                $.when(editSavedTimelines(), saveTimelines()).done(function() {
                    location.reload();
                });
            },
            Cancel: function() {
                $(this).dialog("close");
            }
        }
    });
}

function saveTimelines() {

    var finalDef = $.Deferred();

    var defs = [];
    for (i=1; i < timelineIndex + 1; i++) {

        var def = $.Deferred();
        defs.push(def);

        $.ajax({...}).done(function(xml) {

            $.ajax({...}).done(function() {

                def.resolve(true);

            });

        });        
    }

    $.when.apply(null, defs).done(function() {
        finalDef.resolve();
    });

    return finalDef.promise();

}

function editSavedTimelines() {

    var finalDef = $.Deferred();

    var defs = [];
    for (j=1; j < savedTimelineIndex + 1; j++) {    

        var def = $.Deferred();
        defs.push(def);

        $.ajax({...}).done(function() {
            def.resolve(true); 
        });
    }

    $.when.apply(null, defs).done(function() {
       finalDef.resolve(true); 
    });

    return finalDef.promise();
}

$.when(undefined, undefined)

function saveOneTimeline(/* any params here, such as i */) {

    // create a deferred object which will be returned by this function and resolved once all calls are complete
    var def = $.Deferred();

    /* ... */

    $.ajax({
        /* ... */    
        success: function (xml) {
            /* ... */                
            $.ajax({
                /* ... */    
                success: function () {
                    // we are done, resolve the deferred object
                    def.resolve();
                }
            });
        }
    });

    // return the deferred object so that the calling code can attach callbacks/use when
    return def;
}

function saveTimelines() {
    // an array to store all of the deferreds
    var defs = [];

    for (i=1; i < timelineIndex + 1; i++) {
        defs.push(saveOneTimeline(i));
    }

    // call when on the array of deferred objects and return the resulting promise object
    return $.when.apply($, defs);
}