無限スクロールをisotopeと一緒に機能させようとしています。ドキュメントとページのソースを確認しましたが、問題が見つかりません。最初にページにある最初の項目は表示されますが、ページの一番下までスクロールしても何も起こりません。
私の HTML には、次のページ (ページ分割されたブログ ページ) へのリンクが含まれています。
<nav id='page-nav'>
<a href='/blog/full-blog?page=2'></a>
</nav>
JavaScript:
$("#container").isotope({
itemSelector: '.item',
isAnimated: true
});
$("#container").infinitescroll({
navSelector: '#page-nav', // selector for the paged navigation
nextSelector: '#page-nav a', // selector for the NEXT link (to page 2)
itemSelector: '.item', // selector for all items you'll retrieve
debug: true,
},
function( newElements ) {
console.log(newElements);
$("#container").isotope( 'appended', $( newElements ) );
}
);
私のページを表示すると、コンソールに次のように表示されます。
["determinePath", Array[2]]
jquery.infinitescroll.min.js:1
["Binding", "bind"] jquery.infinitescroll.min.js:1
["math:", 497, 451] jquery.infinitescroll.min.js:1
["math:", 0, 451] jquery.infinitescroll.min.js:1
["heading into ajax", "/blog/full-blog?page=2"] jquery.infinitescroll.min.js:1
Using HTML via .load() method jquery.infinitescroll.min.js:1
XHR finished loading: "http://localhost:4567/blog/full-blog?page=2". jquery.js:8240
["Error", "end"] jquery.infinitescroll.min.js:1
["Binding", "unbind"]
最後の 2 行の意味を説明できる人はいますか? 明らかにエラーですが、end とはどういう意味ですか? ロードするページはもうありませんか? 私の例では、ロードする項目が 3 ページあります。Unbind、スクロールイベントはアンバインドされていますか? エラー ログに関するドキュメントや情報が見つかりません...