如何自动链接一系列ajax请求

How can I automate chaining a series of ajax requests?

本文关键字:ajax 请求 一系列 链接 何自动      更新时间:2023-09-26

看看我函数的下半部分:我想重复info(url_part1 + next + url_part2, function(next) {几次。有没有比下面介绍的方法更聪明的方法(也许是某种循环)?我想了一整天,什么都想不出来。

 function info(link, callback) {
        $.getJSON(link, function(json) {
            $.each(json.data.children, function(i, things) {
                $("#threadlist").append('<img src="' + things.data.url + '">');
            });
            callback(json.data.after);
        });
    }
    var url_first = "http://www.reddit.com/r/aww/.json?jsonp=?";
    var url_part1 = "http://www.reddit.com/r/aww/.json?after=";
    var url_part2 = "&jsonp=?";
    info(url_first, function(next) {
        info(url_part1 + next + url_part2, function(next) {
            info(url_part1 + next + url_part2, function(next) {
                info(url_part1 + next + url_part2, function(next) {
                    info(url_part1 + next + url_part2, function(next) {
                    });
                });
            });
        });
    });

Js小提琴:http://jsfiddle.net/rdUBD/1/

也许是这样的:

http://jsfiddle.net/JwAbK/

您可能需要考虑递归处理它们。

function processRequest( request)
{
      $.getJSON(request,function(json) {
          // process json
          if (json.data.after) {
             processRequest( "http://www.reddit.com/r/aww/.json?after="
                                 + json.data.after 
                                 + "&jsonp=?" );
          }
      });
}
processRequest("http://www.reddit.com/r/aww/.json?jsonp=?");

如果我理解正确的话,你似乎只想递归地调用一个函数,最多调用一定次数。以下是正是这样做的示例代码:

function testFunction(number, callback) {
    document.writeln("testFunction() called with number = " + number + "<br />");
    callback(number + 1);
}
var CallCount = 0;
testFunction(1, function(next) {
    CallCount++;
    document.writeln("callback called next = " + next + "<br />");
    if(CallCount == 5) {
        document.writeln("callback called 5 times, don't call it again");
    } else {
        testFunction(next, arguments.callee);
    }
});

该代码输出以下内容:

testFunction() called with number = 1
callback called next = 2
testFunction() called with number = 2
callback called next = 3
testFunction() called with number = 3
callback called next = 4
testFunction() called with number = 4
callback called next = 5
testFunction() called with number = 5
callback called next = 6
callback called 5 times, don't call it again

你可以在jFiddle上试试:http://jsfiddle.net/luisperezphd/NQya6/

将此应用于你的代码,你会得到:

var DebugCount = 0;
function EmulateGetJson(link, callback) {
    DebugCount++;
    callback({
        data: {
            children: [
                { data : { url: "https://www.google.com/images/srpr/logo3w.png?" + DebugCount, next: "next" } }
            ]
        }
    });
}
 function info(link, callback) {
    //$.getJSON(link, function(json) {
    EmulateGetJson(link, function(json) {
        $.each(json.data.children, function(i, things) {
            $("#threadlist").append('<img src="' + things.data.url + '">');
        });
        callback(json.data.after);
    });
}
var url_first = "http://www.reddit.com/r/aww/.json?jsonp=?";
var url_part1 = "http://www.reddit.com/r/aww/.json?after=";
var url_part2 = "&jsonp=?";
var CallCount = 0;
var TargetCallCount = 5;
info(url_first, function(next) {
    CallCount++;
    if(CallCount != TargetCallCount) {
        info(url_part1 + next + url_part2, arguments.callee);
    }
});

这方面的jsFiddle可以在以下位置找到:http://jsfiddle.net/luisperezphd/uY8Kj/

为了提供一个完整的示例,我在JavaScript代码中模拟了对$.getJSON的调用。我在示例图像URL的末尾添加了一个数字,以说明每次都会返回不同的URL。

arguments.callee指的是当前函数,在这种情况下是作为回调传递给info()的函数,这是递归的关键。