jQuery Masonry无限滚动不会停止
问题描述:
我正在使用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);
});
}
);
});
答
砌体无限滚动脚本正在加载您的根页面文件夹中的页面。 所以,如果你想只加载一个页面,只需删除此文件夹中的其他HTML页面。 文件夹名称:页面。 页面的名称:2.html,3.html,4.html,....
因此,删除页面(3.html,4.html,如果你发现更多只是删除它们),只是保持该页面(2.html)。
享受。
答
我遇到了同样的问题。这是你的404页面没有找到的问题。一旦页面用完,大多数CMS将返回最后一个有效的分页内容。当“下一页”链接调用不存在的页面时,您需要将后端配置为抛出404。
要确认这是您的问题,请尝试更改您在网址中的号码。即如果您有5页,第五页是www.example.com/category/page?id=5,请尝试访问www.example.com/category/page?id=99。它应该填充与最后一个有效页面相同的内容(在本例中为第5页)
您正在使用哪个CMS?
答
这里是一个简单的例子,我在我的代码中使用.. 我设置全局变量和基于我发现我的数据是否完全加载或没有..如果我得到数据空它意味着所有的内容是加载,我设置停止负载变量为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>
我有这个问题与警予,就像你说的它传递的最后一个现有的页面后返回最后一页。你知道我怎么能用yii解决这个问题吗? – 2012-08-06 12:25:59
好吧,我明白,如果在分页yii设置validateCurrentPage为false,那么它工作正常与jQuery的石工。 – 2012-08-06 12:42:27