Javascript 由于异步。get jQuery函数导致表布局错误

我试图用数据库中每个单元格的不同信息填充时间表。正在通过以下函数刷新该表：

function refreshTable() {
    //Form values
    var park = $('#Park').val();
    var building = $('#Building').val();
    var room = $('#Room').val().split(' ')[0];
    //var room = temp[0];
    var semester = $('#Semester').val();
    var week = $('#Week').val();



    //Days and times arrays
    var days = ["Monday", "Tuesday", "Wednesday", "Thursday", "Friday"];
    var times = ["9:00-9:50", "10:00-10:50", "11:00-11:50", "12:00-12:50", "13:00-13:50", "14:00-14:50", "15:00-15:50",
                    "16:00-16:50", "17:00-17:50"];
    var periods = [1, 2, 3, 4, 5, 6, 7, 8, 9];

    //Initializing tableHTML variable
    var tableHTML = "<table><tr><th><p style='text-align: center'>-</p></th>";
    //Appending first row
    for (var i = 0; i < 9; i++) {
        tableHTML += "<th>" + times[i] + "</th>";
    }
    tableHTML += "</tr>";


    //Nested for loop to append timetable slots to tableHTML
    var period, day, result;
    for (var k = 0; k < 5; k++) {
        tableHTML += "<tr><th>" + days[k] + "</th>";
        day = days[k];
        for (var l = 0; l < 9; l++) {
            period = periods[l];

            $.get('@Url.Action("getAvailability")', { parkName: park, buildingName: building, roomCode: room,
                semester: semester, week: week, day: day, period: period
            }, function (data) {
                tableHTML += "<td>"+data+"</td>";
            });

        }
        tableHTML += "</tr>"
    }
    //Finish tableHTML and set #tableDIV to contain it.
    tableHTML += "</table>";
    $('#tableDiv').html(tableHTML);
}

函数刷新表（）{
//形式值
var park=$（'#park'）.val（）；
var building=$（'#building'）.val（）；
var room=$（'#room'）.val（）.split（''）[0]；
//var房间=温度[0]；
var学期=$（“#学期”）.val（）；
var week=$（'#week'）.val（）；
//天数和时间数组
风险值天数=[“周一”、“周二”、“周三”、“周四”、“周五”]；
变量时间=[“9:00-9:50”，“10:00-10:50”，“11:00-11:50”，“12:00-12:50”，“13:00-13:50”，“14:00-14:50”，“15:00-15:50”，
"16:00-16:50", "17:00-17:50"];
风险值期间=[1,2,3,4,5,6,7,8,9]；
//初始化tableHTML变量
var tableHTML=“
-
”；
//追加第一行
对于（变量i=0；i<9；i++）{
tableHTML++=''+次[i]+''；
}
tableHTML+=“”；
//嵌套for循环将时间表槽附加到tableHTML
风险价值期间、日、结果；
对于（var k=0；k<5；k++）{
tableHTML+=“”+天[k]+“”；
天=天[k]；
对于（var l=0；l<9；l++）{
周期=周期[l]；
$.get（'@Url.Action（“getAvailability”），{parkName:park，buildingName:building，roomCode:room，
学期：学期，周：周，日：日，周期：周期
}，函数（数据）{
tableHTML+=“”+数据+“”；
});
}
表格HTML+=“”
}
//完成tableHTML并将#tableDIV设置为包含它。
tableHTML+=“”；
$（'#tableDiv'）.html（tableHTML）；
}

但是，由于jQuery get函数异步调用它，因此只有.get之外的单元格被写入tableHTML变量

我能做些什么来防止这种情况？我不想使用ajax并关闭async，因为这会大大增加加载页面的时间，但目前我看不到解决方法

---

提前感谢。

因为您正在进行异步调用，所以需要一种机制将数据放回它所属的DOM中（而不是简单地将其连接起来）。因此，您需要将k和l传递给get命令。您可以使用内置的k和l放置占位符，例如

“”

当ajax返回时，您可以将数据放在DOM中它所属的位置