在文档准备好之前从服务器获取AJAX数据(jQuery)

Question

我想从服务器获取一些数据并用JavaScript将其写入全局数组.然后在文档就绪中我想使用这个数组来创建一些新元素(选项).我应该有这个数据的全局数组,因为在第一次加载客户端后可以使用这个数据修改用户界面.

$(document).ready(function () {
    UseAjaxQueryForFillGlobalArray();
    MakingInterfaceUsingGlobalArray();       
});

但我有奇怪的行为,当我调试页面时,我可以看到MakeInterfaceUsingGlobalArray方法首先工作,刚刚通过AJAX获取数据后,方法UseAjaxQueryForFillGlobalArray,我没有新的接口(html选项)加载数据.

如果我喜欢这样:

UseAjaxQueryForFillGlobalArray();
$(document).ready(function () {     
    MakingInterfaceUsingGlobalArray();       
});

然后在Firefox工作正常,但在第一次加载时其他网络浏览器不正确(例如通过链接转到此页面).但是如果我用F5刷新,我有正确的用户界面,它通过AJAX加载到全局JS数组.

怎么解决？也许我使用完全不正确的方式？

评论后添加:

这是我的ajax功能:

function UseAjaxQueryForFillGlobalArray(){
    var curUserId = '<%= Master.CurrentUserDetails.Id %>';
    var curLocale = '<%= Master.CurrentLocale %>';
    $.ajax({
        type: "POST",
        url: "/segment.aspx/GetArrayForCF",
        data: '{"userId":"' + curUserId + '","curLocale":"' + curLocale + '"}',
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function (msg) {
            //here is I doing parse my string from server and fill arrays.     
        }
    });
}

Answer 1

我认为问题是你不知道第一个函数何时返回,因为它是异步的.所以你应该只在回调中使用数组

function UseAjaxQueryForFillGlobalArray() {
    // make the call
    $.post(url, data, function() {
        // let's be sure that the dom is ready
        $(document).ready(function () {    
            // use the array
            MakingInterfaceUsingGlobalArray();      
        }
    }
}();// invoke the function