加载未在加载时设置的vars的JavaScript文件

时间:2011-09-25 22:22:27

标签: javascript

帖子标题可能无法完全解释,但这是我希望做的:我将我的JavaScript代码放在一个单独的文件中,我将其安排如此

var PK = {
    "vars" : {
        "uris" : {
            "app1": "http://this/server/",
            "app2": "http://that/server/"
        },

        "something": {
            "objects": [],
            "obj1": { "url": PK.vars.uris.app1 },
            "obj2": { "url": PK.vars.uris.app2 }                                   
        }
    },

    "methods" : {
        "doThis" : function(a) {
            $.ajax({
                url: PK.vars.uris.app1,
                data: data,
                type: "GET",
                success: function(data) { .. do something .. }
            });     
        },

        "doThat" : function(a) {
            $.ajax({
                url: PK.vars.uris.app2,
                data: data,
                type: "GET",
                success: function(data) { .. do something else .. }
            });     
        },

        "init" : function(position) {
            if (position) { PK.methods.doThis();
            }
            else {
                PK.methods.doThat();
            }
        }
    }
};

然后,在我的HTML中,我有以下

$(document).ready(function() {
    PK.vars.uris.app1 = "[% app1 %]";
    PK.vars.uris.app2 = "[% app2 %]";
    PK.methods.init();
});

其中app1app2的值基于配置文件从服务器发送。除此之外,它不能按预期工作,因为当单独的JavaScript加载时,PK.vars.uris在那时没有定义。当然,如果我有PK.vars.uris {}硬编码,那么一切都很美妙。

如何在文档加载并且var PK可用于JavaScript代码之前延迟PK.vars.uris的评估?

1 个答案:

答案 0 :(得分:2)

是否需要将值传递给初始化程序?

这种方法如何:

在您的外部文件中:

  function PK_Constructor(app1Uri, app2Uri) {
        this.vars = { "uris" : {
                    "app1" : app1Uri,
                    "app2" : app2Uri
            },
               "something": {
                    "objects": [],
                    "obj1": { "url": app1Uri },
                    "obj2": { "url": app1Uri }                                   
                 },
            };
       this.doThis = function(a) {
           $.ajax({
               url: this.vars.uris.app1,
               data: data,
               type: "GET",
               success: function(data) { .. do something .. }
           }); 
       // etc

    }

在你的HTML中:

   // Ensuring PK has global scope
   var PK = undefined;

   $(document).ready(function() {
       PK = new PK_Constructor("[% app1 %]", "[% app2 %]");
   });