加载x更多结果?

时间:2012-05-12 15:55:12

标签: jquery xml

我有以下片段用于通过jml从xml文件加载xml:

    $.ajax({
    type: "GET",
    url: "myxml.xml",
    dataType: "xml",
    success: function (data) {
        $(data).find("seperator").each(function () {
                $("body").append($(this).attr("MyAttr"));
        });
    }
});

xml文件可以包含数百个结果。所以我不想一次只显示它们,而是想在页面上添加一个“加载20多个......”按钮,这将...再加载20个结果。因此,当页面初始加载时,它显示前20个结果,单击按钮然后加载并从xml等中追加20个。

我怎么能实现这个目标?

1 个答案:

答案 0 :(得分:0)

注意:只是一个演示代码代表了一个帮助您找到正确方法的示例。

var items = [];

// creating some demo items
for (var i = 0; i < 100; i++) {
    items.push($('<div>Index ' + i + '</div>'));
}

var alreadyAdded = 0,
    // keep index of last added item
    total = items.length; // total # of items
// function that will add element


function add() {
    $.each(items, function(index, item) {
        $('#container').append(items[alreadyAdded]); // adding element
        alreadyAdded++; // increasing index to keep record of last one added
        if (alreadyAdded % 20 == 0) { // checking that if 20 items added
            return false;
        }
        if (alreadyAdded == total - 1) $('.load').hide(); // hide load button when all items added
    });
}

$('.load').on('click', function() {
    add(); // call on load more click
});

add(); // initial call for add first 20 items​

<强> DEMO