0

我看了又看,我还在摸不着头脑。如果我遗漏了一些明显的东西,我道歉。我试图创建一个我自己编写的自定义函数库(感谢 stackoverflow 帮助我解决了这个问题......)。然后我有一个在调用网页时加载的 javascript 文件,该文件又调用我的自定义库中的所述函数。

我有一个getConfig()很明显的函数。它获取一个 JSON 文件,其中包含我的服务器的配置详细信息,该服务器托管我的所有 RESTful Web 服务。当我单步执行代码时,配置详细信息按预期返回,但是,当我全速加载网页时,配置对象返回为undefined. 我认为这可能是一个时间问题,所以我把所有东西都包在一个$(document).ready(function())块里,但不行。我什至尝试了一个window.onload = function(){}块来确保在调用自定义库之前加载所有内容。没运气!它让我头脑清醒,因为我一生都无法弄清楚发生了什么。

我的自定义库文件看起来像这样的文件名xtendLibs.js

var xtendLibs = {
    getConfig           :   function(){

        var CONFIG;

        $.getJSON("/js/config.json", function(json){
            CONFIG = json;
        });
        return CONFIG;
    },
    getObjects          :   function(config, medicareno, medicarelineno, objectType){

        var object;

        var urlString = config.scheme + config.muleHost + config.mulePort + ":/patients/";

        switch(objectType){
            case ("details") : 
                urlString = urlString + "details/" + medicareno + "/" + medicarelineno ;
                break;
            case ("appointments") :
                urlString = urlString + "appointments/" + medicareno +"/" + medicarelineno;
                break;
        }

        $.ajax({
            type    :   'GET',
            url     :   urlString,
            success :   function(data){
                object = data;
            },
            failure :   function(){
                alert("Failure");
            }
        });
        return object;
    },
    getUrlParameters    :   function(){
        var paramsArray = window.location.search.substring(1).split("&");
        var obj = [];
        var tempArray;
        var paramName,paramValue;

        for(var i = 0; i < paramsArray.length; i++){
            tempArray = paramsArray[i].split("=");
            paramName = tempArray[0];
            paramValue = tempArray[1];
            obj[paramName] = paramValue;
        }

        return obj;
    }

};

上面文件中调用各种函数的javascript文件长这样appts.js

window.onload = function(){

    var config, params, appointments;

    params = xtendLibs.getUrlParameters();   // This line works - and params is returned

    config = xtendLibs.getConfig(); // This line fails but will work if I step through the code

    appointments = xtendLibs.getObjects(    config, 
                                            params["medicareno"],
                                            params["medicarelineno"],
                                            "appointments");

    console.log(params);
}

我真的很难过。任何帮助将不胜感激。

4

1 回答 1

0

Ajax is async process, so when getJson is called it does not stop the execution of next statement.

getConfig : function(){

     var CONFIG;

     $.getJSON("/js/config.json", function(json){
          CONFIG = json;
     });
     return CONFIG;
}

When getJson is called it switches to a new thread, and the next statement which is in this case is "return CONFIG;" is executed. However, CONFIG has not been defined yet, so it is returning as undefined.

How Could you solve this problem?

You could not solve this problem. Not using this code design. You could non async the ajax, but it will make your page freeze.

You could set a global variable "config" when "getConfig" is called and check whether the config variable is defined when executing any function concerning it, but the best approach would be to pass a function, containing all the statements to be executed when config has finished loading, in getConfig function and call it when "/js/config.json" has loaded.

于 2018-02-10T06:07:57.470 回答