2012-02-12 75 views
2

我正在使用jquery masonry无限滚动脚本。分页下一页正在重复加载。我怎样才能阻止它?当我每次滚动页面时都重复附加分页内容,而不是显示诸如“没有更多内容加载”的消息。jQuery Masonry无限滚动不会停止

$(function(){ 
    // alert($('.pin_item').length); 

    var $alpha = $('#alpha');   
    $alpha.masonry({ 
     itemSelector: '.pin_item', 
     columnWidth: 230, 
     //isAnimated: true 
    }); 

    $alpha.infinitescroll({ 
     navSelector : '#page-nav', // selector for the paged navigation 
     nextSelector : '#page-nav a', // selector for the NEXT link (to page 2) 
     itemSelector : '.pin_item',  // selector for all items you'll retrieve 
     bufferPx  : 50, 

     loading: { 

      finishedMsg: 'No more pages to load.', 
      img: 'http://i.imgur.com/6RMhx.gif' 
     } 
     }, 

     // trigger Masonry as a callback 
     function(newElements) { 
     // hide new items while they are loading 
     var $newElems = $(newElements).css({ opacity: 0 }); 
     // ensure that images load before adding to masonry layout 
     $newElems.imagesLoaded(function(){ 
      // show elems now they're ready 
      $newElems.animate({ opacity: 1 }); 
      $alpha.masonry('appended', $newElems, true); 
     }); 
     } 
    ); 

}); 

回答

-2

砌体无限滚动脚本正在加载您的根页面文件夹中的页面。 所以,如果你想只加载一个页面,只需删除此文件夹中的其他HTML页面。 文件夹名称:页面。 页面的名称:2.html,3.html,4.html,....

因此,删除页面(3.html,4.html,如果你发现更多只是删除它们),只是保持该页面(2.html)。

享受。

1

我遇到了同样的问题。这是你的404页面没有找到的问题。一旦页面用完,大多数CMS将返回最后一个有效的分页内容。当“下一页”链接调用不存在的页面时,您需要将后端配置为抛出404。

要确认这是您的问题,请尝试更改您在网址中的号码。即如果您有5页,第五页是www.example.com/category/page?id=5,请尝试访问www.example.com/category/page?id=99。它应该填充与最后一个有效页面相同的内容(在本例中为第5页)

您正在使用哪个CMS?

+0

我有这个问题与警予,就像你说的它传递的最后一个现有的页面后返回最后一页。你知道我怎么能用yii解决这个问题吗? – 2012-08-06 12:25:59

+0

好吧,我明白,如果在分页yii设置validateCurrentPage为false,那么它工作正常与jQuery的石工。 – 2012-08-06 12:42:27

0

这里是一个简单的例子,我在我的代码中使用.. 我设置全局变量和基于我发现我的数据是否完全加载或没有..如果我得到数据空它意味着所有的内容是加载,我设置停止负载变量为1

假设DOM是d形式的..

<div class="results_list"> 
    <ul id="divid"> 
<li class="results">data...</li> 
<li class="results">data...</li> 
</ul> 
</div> 
<script> 
$(document).ready(function() { 
    window.load_start = 0; 
    window.load_stop = 0; 
$(".results_list").scroll(function(){ 
    if(window.load_stop != 1) { 
     if($('.results').hasClass('last')) { 
      $('.results').removeClass('last'); 
     } 
     window.load_start += 40; 
     //40.. to load items from 40.. if u hav loaded 40 items a time before.. 
     $.ajax({ 
      url:"/url.php", 
      data:"action=params+"&lazyload=1&start_load="+window.load_start, 
      method:"GET", 
      success: function(data) { 
       data = $.trim(data); 
     //data is in the form of html.. <li class="results">hi load item from -  start_load i.e., passed in params by ajax.. above </li> 
       if(data == undefined || data == '') { 
        window.load_stop = 1; 
        return false; 
       } 
       $('#divid').append(data); 
      } 
     }); 
    } 
}); 
}); 
</script> 
//u can add a condition to send ajax call(load items) only on scrolling down the div. 
</code>