javascript - 在第一个 Jquery 完成之前第二个 Jquery json 被触发

Question

我有两个 javascript 函数，它们使用 jquery json 填充一些数据。两者都工作正常，但问题是第二个函数在第一个函数执行之前被调用。我的代码是:

$(document).ready(function () {        
    loadSubject();
    getTopic();       
});

function loadSubject() {
    var CourseId = document.getElementById('CourseId').value;
    alert('22222');
    jQuery.support.cors = true;
    $.ajax({
        url: 'http://220.45.89.129/api/LibraryApi',
        type: 'Get',
        contentType: 'application/x-www-form-urlencoded; charset=UTF-8',
        data: { DataType: 'Subject', UserRecId: 0, ParentId: CourseId },
        dataType: 'json',
        success: function (data) {
            var subjectDivs = "";
            var divs = "";
            var i = 1;
            $.each(data, function (index, value) {
                divs = "";
                // Some code here
                i = i + 1;
            });
            subjectDivs = subjectDivs + divs;
            alert('11111');
            $('#cCount').val(i);
            document.getElementById('accordion').innerHTML = subjectDivs;
        },
        error: function (e) {
            alert(JSON.stringify(e));
        }
    });
}

function getTopic() {
    var c = $('#cCount').val();
    alert(c);
    for (var i = 1; i <= c; i++) {
        var subId = $('#hdn_' + i).val();
        jQuery.support.cors = true;
        $.ajax({
            url: 'http://220.45.89.129/api/LibraryApi',
            type: 'Get',
            contentType: 'application/x-www-form-urlencoded; charset=UTF-8',
            data: { DataType: 'Topic', UserRecId: 0, ParentId: subId },
            dataType: 'json',
            success: function (data) {
                var topicDivs = "";
                var divs = "";
                tDivs = '';
                $.each(data, function (index, value) {
                    divs = '';
                    divs = '<div class="row">';
                    divs = divs + '<div class="subject">' + value.Name + '</div>';
                    divs = divs + "</div>";
                    topicDivs = topicDivs + divs;
                });
                $('#sDiv_' + i).html(topicDivs);
            },
            error: function (e) {
                alert(JSON.stringify(e));
            }
        });
    }
}

Answer 1

这不是 ajax get 的执行方式。如果你一个接一个地放置两个 jquery ajax 请求，那么它们将按顺序执行，不需要在第一个请求完成或收到第一个请求的响应后才执行第二个请求。

如果你希望这种情况发生，有两种方法

<强>1。使用 async:'false'

这会请求等待，直到收到响应，然后再执行 JavaScript 中的下一条语句。

What does "async: false" do in jQuery.ajax()?

<强>2。使用回调

编写您想要成功执行的第二个函数或完成第一个 ajax 请求的回调。

jQuery ajax success callback function definition