JQUERY:点击时在容器中追加下一个项目

时间:2013-01-23 05:50:42

标签: xml ajax jquery xml-parsing

使用AJAX成功方法解析XML数据,并使用LOAD MORE数据选项放入表中,当用户点击LOAD MORE按钮时,第一次添加下N个项目,当用户第二次点击时添加相同的项目列出。

以下是我的代码,

function populateItems(position,page_size) {
    var url = "path_to_XML";
$.ajax({
type: "GET",
url: url,
dataType: "xml",
success: function(xml) {
  var title, url, block_count;
  var xmlDOM = $(xml);
  block_count = $(xml).find('item').length;
  xmlDOM.find("item").slice(position,position+page_size).each(function(){
            var $this=$(this);
            var $user=$this.find("user").text();
            var $fname=$this.find("fname").text();
            var $lname=$this.find("lname").text();
            var $sex=$this.find("sex").text();
            var $time=$this.find("time").text();
            $("#datatable").append("<tbody><tr class='datarow'><td>"+$time+"</td><td>"+$user+"</td><td>"+$fname+"</td><td>"+$lname+"</td><td>"+$url+"</td></tr><tbody>");
  });
                    $('#ajax-loader').hide();
}
});
}

 $(document).ready(function() {
    var position;var page_size;
    populateItems(0,40);
            $('#append2').click(function(position){
                    $('#log_hourly').show();
                    $items = populateItems(40,40);
                    $("#content").append($items);
                    $('#ajax-loader').hide();
            });

当用户点击“加载更多”按钮时,如何继续添加下列N个项目

请帮助..

1 个答案:

答案 0 :(得分:0)

当我回答here时,你需要创建一个变量来计算你要显示或想要加载的页面,只是在你的情况下你需要每次增加40:

$(document).ready(function() {
    var page = 0;
    var position;var page_size;
    populateItems(page ,40);
    $('#append2').click(function(position){
        $('#log_hourly').show();
        page = page + 40;
        $items = populateItems(page ,40);
        $("#content").append($items);
        $('#ajax-loader').hide();
});