Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/399.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181

Warning: file_get_contents(/data/phpspider/zhask/data//catemap/2/python/325.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 异步获取多个json文件后触发回调_Javascript_Jquery_Json_Asynchronous - Fatal编程技术网

Javascript 异步获取多个json文件后触发回调

Javascript 异步获取多个json文件后触发回调,javascript,jquery,json,asynchronous,Javascript,Jquery,Json,Asynchronous,我有3个来自旧论坛的JSON文件,包含:成员、主题和回复。 现在,我想通过javascript/jquery获取3个json文件,在网站上呈现它 我可以通过首先获取成员、返回时获取主题和返回时获取回复来同步完成。但是我想异步地做 是否有类似于$.getJson的东西可以获取多个URL,然后返回一个结果数组?与富有想象力的$.getJson([url1,url2,url3],callBackFunction)一样,与许多jQuery方法一样,异步加载数据。这意味着您可以调用函数,而不是阻止执行。一

我有3个来自旧论坛的JSON文件,包含:成员、主题和回复。 现在,我想通过javascript/jquery获取3个json文件,在网站上呈现它

我可以通过首先获取成员、返回时获取主题和返回时获取回复来同步完成。但是我想异步地做


是否有类似于$.getJson的东西可以获取多个URL,然后返回一个结果数组?与富有想象力的$.getJson([url1,url2,url3],callBackFunction)一样,与许多jQuery方法一样,异步加载数据。这意味着您可以调用函数,而不是阻止执行。一旦加载了内容,它就会触发回调函数

举一个简单的例子:

console.log( "loading first file..." );
$.getJSON( "file1.js", function( json ) {
  console.log( "first file loaded!" );
});

console.log( "loading second file..." );
$.getJSON( "file2.js", function( json ) {
  console.log( "second file loaded!" );
});

console.log( "loading third file..." );
$.getJSON( "file3.js", function( json ) {
  console.log( "third file loaded!" );
});
您将看到所有“加载”控制台日志将立即输出,文件1/2/3的内容将立即开始下载


您可以让所有回调函数执行相同的函数,该函数将存储一个计数器,指示加载了多少资源,一旦加载完所有回调函数,您就可以调用最终回调函数:

$.getJSON( "file.js", function( json ) {
  // Do whatever you want with the `json` parameter
  resource_loaded(); // monitor loaded resources.
});

var total_resources = 0
var loaded_resources = 0;
function resource_loaded(){
  loaded_resources += 1;
  if ( loaded_resources === total_resources ){
    final_callback();
  }
}
使用:


你可能想用类似的东西。它允许您列出一系列承诺,并在它们全部完成时进行回调。除了列出承诺,您还可以使用
apply
将数组传递给
$。例如:

var endpoints = [url1, url2, url3];
var promises = [];

// Simple function that takes an endpoint and returns a promise.
// I've used $.ajax here, but all of jQuery's
// XHR objects use the promise interface
function getData(endpoint) {
  return $.ajax({
    type: 'GET',
    url: endpoint,
    dataType: 'jsonp'
  });
}

// Build an array of promises.
for (var i = 0, l = endpoints.length; i < l; i++) {
  promises.push(getData(endpoints[i]));
}

// Pass the promises to `$.when`. Show the returned data when
// the promises have all finished processing.
$.when.apply(null, promises).then(function (data1, data2, data3) {
  console.log(data1, data2, data3);
});
var端点=[url1、url2、url3];
var承诺=[];
//接受端点并返回承诺的简单函数。
//我在这里使用了$.ajax,但是所有jQuery
//XHR对象使用promise接口
函数getData(端点){
返回$.ajax({
键入:“GET”,
url:endpoint,
数据类型:“jsonp”
});
}
//建立一系列承诺。
对于(变量i=0,l=endpoints.length;i
var endpoints = [url1, url2, url3];
var promises = [];

// Simple function that takes an endpoint and returns a promise.
// I've used $.ajax here, but all of jQuery's
// XHR objects use the promise interface
function getData(endpoint) {
  return $.ajax({
    type: 'GET',
    url: endpoint,
    dataType: 'jsonp'
  });
}

// Build an array of promises.
for (var i = 0, l = endpoints.length; i < l; i++) {
  promises.push(getData(endpoints[i]));
}

// Pass the promises to `$.when`. Show the returned data when
// the promises have all finished processing.
$.when.apply(null, promises).then(function (data1, data2, data3) {
  console.log(data1, data2, data3);
});