Question

我有一个在document.ready中调用的JS函数。目的是当它滚动到底部窗口时，它将从JSON API加载更多。

API具有参数offset和limit。偏移控制您看到的结果子集。对于前者20-40将偏移= 20并且限制控制一次可以查看的数量。

我想我会用一个递归函数来处理它，每次用户使用window.scroll进入窗口底部时调用它。一旦它们到达底部，它每次将偏移量增加20，然后再次运行该函数。

问题：我似乎无法将变量增加20以使其工作。想法？

function getData(offset) {
var jsonCallback = "&jsoncallback=?";
//var offset = 20;
//var offset += 20;
var limit = 20;

var characterURL = "http://api.example.com/character&byId=" + characterID + "&offset=" + offset + "&limit=" + limit;    

$.getJSON(characterURL + jsonCallback, function(data) {
    for (i=0; i < (data.data.results).length; i++) {

        var $characterUl = $("<ul>");
        $characterUl.appendTo("#characterComics");
        $("<li>").text(data.data.results[i].title).appendTo($characterUl);  
        $("<li>").text(data.data.results[i].id).appendTo($characterUl);  
        $("<li>").text(data.data.results[i].release_date).appendTo($characterUl);  
        if (data.data.results[i].release_date > 0) {
            $characterLi.text(data.data.results[i].issue_number).appendTo($characterUl);      
        }  
    }

    $(window).scroll(function() {
        if($(window).scrollTop() + $(window).height() > $(document).height() - 10) {
            while ((data.data.results).length === offset || (data.data.results).length > offset) {
                offset = offset+20;
                $("<div>").text(offset).appendTo("body");
                getComics(offset);
            }
        }
    });
   });
}

$(document).ready(function() {    
var $characterComics = $("<div>", {id : "characterComics"});
$characterComics.appendTo("body");
getData(0);
});

Answer 1

<强>已更新再读这个伪代码

function getData(offset) {
    var jsonCallback = "&jsoncallback=?",
    characterURL = "http://api.example.com/character&byId=" + characterID + "&offset=" + offset + "&limit=" + limit;    

    $.getJSON(characterURL + jsonCallback, function(data) {
        for (i=0; i < (data.data.results).length; i++) {
            var $listItem = $("<li>");
            listItem.append("<span>"+data.data.results[i].title+"</span>");
            listItem.append("<span>"+data.data.results[i].id+"</span>");
            listItem.append("<span>"+data.data.results[i].release_date+"</span>"); 
            if (data.data.results[i].release_date > 0) {
                listItem.append("<span>"+data.data.results[i].issue_number+"</span>");   
            }
            listItem.appendTo($characterUl);
            itemsLoaded++;
        }
   });
}

$(document).ready(function() {
    var $characterComics = $("<div>", {id : "characterComics"}),
        $characterUl = $("<ul>"),
        offset = 0,
        itemsLoaded = 0;
        limit = 20;
    $characterComics.appendTo("body");
    $characterUl.appendTo($characterComics);

    $(window).scroll(function() {
        if($(window).scrollTop() + $(window).height() > $(document).height() - 10) {
            if ("check here if you reached your offsets") {
                offset = offset+20;
                getData(offset);
            }
        }
    });
   // get your first set of data
   getData(0);
});

jQuery如何在递归函数中按值增加变量

1 个答案: