将json加载到对象并从远程文件访问 - 纯JavaScript

时间:2015-10-27 13:08:17

标签: javascript json object

我尝试加载多个json文件,将响应存储在全局数组中,然后从另一个文件访问该数组。

到目前为止,我有以下内容:

页面上的

我创建了全局对象并包含回调函数。

var globalObject = {};
function JsonCallback(j){
  globalObject.dataArray.push(j);
};

在远程文件中我有以下

(function(){
  globalObject.dataArray = [];
  globalObject.urlArray = [
    'http://externaldomain.com.jsonp?uniqueID=1234&callback=JsonCallback',
    'http://externaldomain.com.jsonp?uniqueID=1235&callback=JsonCallback',
    'http://externaldomain.com.jsonp?uniqueID=1236&callback=JsonCallback',
    'http://externaldomain.com.jsonp?uniqueID=1237&callback=JsonCallback'
  ];
  var runFunction = function(index){
    console.log(index); 
    console.log(globalObject.dataArray[index]);
    // index doesn't match as files finish loading in different orders
  };

  var loadFunction = function(url, index){
    var script = document.createElement("script");
    script.onload = function(){
      runFunction(index);
    };
    script.src = url;
    document.getElementsByTagName("head")[0].appendChild(script);
  };

  var init = function(){
    for(var i = 0;i<globalObject.urlArray.length;i++){
      loadFunction(globalObject.urlArray[i], i);
    }
  }();

})();

对于urlArray中的每个url,我创建一个脚本元素,它加载json文件并触发JsonCallback函数,将响应存储在全局dataArray中。

加载文件后,执行runFunction,特定于刚刚加载的文件。但是,因为json文件没有按照创建的顺序完成加载,所以&#39; index&#39;在runFunction中并不总是匹配dataArray索引。

如何解决/避免这个问题的任何想法都将非常感激。

0 个答案:

没有答案