9周的div阿贾克斯jQuery的负载在时间

Question

我有一个div，看起来像这样：

<div class="all_articles third_article_module"> 
    <!--load in content from loadmore.html via ajax --> 
</div> 

我也有一个节目我更多的文字，看起来像这样：

<div class="showmemore"> 
    <h2>Load more articles</h2> 
</div> 

我的loadmore.html页面循环显示所有文章。我想要做的事情是每次只显示一些文章（例如9），然后将h2标签附加到div的末尾。当没有更多的文章离开时，我希望隐藏h2标签。我的JS是这样的：

$('.showmemore_inner h2').on("click", function(e){ 
    e.preventDefault(); 
    $('.third_article_module').load('loadmore.html'); 
}); 

$(document).ajaxStart(function(){ 
    $(show_header).text('Loading more articles').css('color', '#4c4c4e'); 
    $('.showmemore .showmemore_inner h2 span').css('display', 'block'); 
}); 

$(document).ajaxComplete(function(){ 
    $('.showmemore').appendTo('.all_articles.third_article_module'); 
    $('.ajax_article').addClass('active'); 
    $(show_header).text('Load more articles'); 
}); 

在我loadmore.html我有一个div容器和内容的每个包裹在这就是所谓的.ajax_article格。

Answer 1

您应该为loadmore.html添加一个参数，以告知您需要多少文章以及从哪里开始。像这样：

var start = 0; 
$('.showmemore_inner h2').on("click", function(e){ 
    e.preventDefault(); 
    $('.third_article_module').load('loadmore.html?articles=9&start=' + start,'',function(data) {if(!data) {$('.showmemore_inner h2').remove();}}); 
    start = start + 9; 
}); 

这将确保每次演出更被点击，接下来的9篇将是牵强，并且如果没有接收到的数据显示更多的将被删除。当然，在loadmore.html中，你只应该循环参数所要求的那些文章。