2017-05-10 12 views
0

私は無限のスクロールの初心者です。私は決してそれを使用しません。私は自分のWebサイトにこのコードを使用しようとしました。ページの一番下にスクロールするときにフッタまで気をつけようとしました。石積みで無限スクロールを開始しよう

私の主な対象はもっと多くです。HTMLは、WebページがWall divの下にスクロールするときに、ajaxとInfinite Scrollを使用しています。 <div id="wall"></div>。このdivは、ページの下部とフッターの上にあります。すべてのHTMLのcontainsは、JQueryを使用して追加され、将来新しいコンテンツが追加されるべきです。

Javascripコード:

$("#wall").infinitescroll({ 
    navSelector: "#next:last", 
    nextSelector: "#next:last", 
    itemSelector: "#content", 
    debug: false, 
    dataType: 'html', 
    maxPage: 4, 
    path: function(index) { 
     return "index" + index + ".html"; 
    } 

    }, function(newElements, data, url){ 
     alert("hi"); 
    }); 

私はときに、スクロール下にアラートを取得するために物乞いのために、このコードを試してみましたが、それは動作しません。

のAjaxコード:

$.post("/php/post.php", 
{ 
    name: "aa", 
    city: "bb" 
}, 
function(data, status){ 
    $("#wall").append(data).masonry().masonry('appended', data, true).masonry("reloadItems").masonry("layout"); 

}); 

Ajaxのレスポンスデータは、HTMLが含まれています。

Infinite Scroll for JQueryの使い方ajaxを使用してさらに多くのHTMLを追加して追加しますか?

ページの下部までスクロールするか、Wall divの下部にスクロールするときに、これらのHTMLに読み込みが含まれていますか?

石積みのInfinite Scrollのチュートリアルウェブサイトが分かっている場合は、教えてください。

+0

は、あなたがしてください – Stumblor

+0

https://github.com/infinite-scroll/infinite-を使用しているプラ​​グイン 'infinitescroll'のjQueryのへのリンクを投稿できますスクロール – ind

答えて

0

まず、debug: trueを使用すると、現在の設定に存在する問題が明らかになります。あなたが使用しているHTMLを知らなければ、それは推測するのは難しいですが、すべてあなたのセレクタは存在する:#next#content?ここで

は、実施例を持っているフィドルです: https://jsfiddle.net/pgh49735/

関連する問題