Question

是否可以通过AJAX加载更多文件？

示例

$.ajax({
  url: ["test1.html", "test2.html", "test3.html"],
  success: function(data1, data2, data3) {
    // Do something  
  }
});

因为我想避免回调......

  $.ajax({
  url: "test1.html",
  success: function(data) {

    $.ajax({
      url: "test2.html",
      success: function(data) {

        $.ajax({
          url: "test3.html",
          success: function(data) {

            // Do something

          }
        });

      }
    });

  }
});

Answer 1

我更喜欢编写递归函数并使用堆栈来实现这样的功能。这只会在处理结束时运行success或error一次，然后按顺序获取每个网址。但是，按顺序提取它们可能会使加载时间更长，因为它不允许浏览器并行化请求！与此不同的变化就是并行运行所有请求，只需按顺序处理结果。

function fetch (urls, success, error) {
  if (urls.length) {
    $.ajax({
      url: urls[0],
      success: function () {
        fetch(urls.slice(1), success, error)
      },
      error: error
    })
  } else {
    success()
  }
}

fetch(["url1.html", "url2.html", ...], function () {
  // success
}, function () {
  // failure
})

正如我刚刚输入的那样，可能会出现一些小错误，但这个概念是合理的。可以做更多的事情，例如传递值/结果，但这些是留下的练习;-)在应用相同的警告时，这里只是按顺序处理结果的版本 - 请求可以并行发送：

function fetch (urls, success, error) {
  var fetched = 0
  var results = []
  var wasError = false
  function _fetch (i) {
    if (i < urls.length) {
      $.ajax({
        url: urls[i],
        success: function (result) {
          // report success when all the results are in
          results[i] = result
          if (++fetched == urls.length) {
            success(results)
          }
        },
        error: function () {
          if (!wasError) {
            wasError = true
            error()
          }
        }
      })
      // re-prime right away
      _fetch(i + 1)
    }
  }
  _fetch(0)
}

var urls = ["url1.html", "url2.html", ...]
fetch(urls, function (results) {
  $.each(results, ...)
}, function () {
  // error :(
})

快乐的编码。

Answer 2

SEXY.js是jQuery中“sequential ajax”的jQuery插件。

Answer 3

是的，确实如此。您无法加载完整的HTML结构（使用BODY元素等） - 您需要使用HTML代码段。

然后你可以将加载的数据注入div元素：

success: function(data) 
 { $("#div_id").html(data); }

jQuery也几乎颓废懒惰.load() shortcut：

$('#div_id').load('ajax/test.html');

Answer 4

默认情况下，AJAX请求是异步的。因此，在发送下一个之前，您不必等待一个结束。只需在同一时间启动它们。

至于你提出的电话，我怀疑有没有实现这样做的东西，但我不认为自己做这件事太难了。

Answer 5

试试这个：

var arr[] = ("test1.html", "test2.html", "test3.html");

for (var i in arr){
    $.ajax({
      url: arr[i],
      success: function(response) {
        // Do something  
      }
    });
}

Answer 6

据我了解，您需要一个链接af ajax调用，只有在前一个调用成功完成后才会有请求

(function ajaxchain(i) {

    var url = ["test1.html", "test2.html", ... ];

    $.ajax({
        url       : url[i],
        success: function(data) {
           console.info('%s loaded', url[i]); 
           ajaxchain(i++);
        },
        error     : function() {
            console.warn('Chain was interrupted at file %s', url[i]); 
        }
    });
})(0);

通过AJAX加载更多文件

6 个答案: