2017-05-10 1 views
0

저는 무한 스크롤을 초보자이며 결코 사용하지 않습니다. 내 웹 사이트에이 코드를 사용하려고했습니다. 바닥 글까지 페이지 맨 아래로 스크롤 할 때주의를 얻으려고했습니다.석공 술과 함께 무한 스크롤을 시작하십시오.

내 주요 타겟은 더 많이로드됩니다. 웹 페이지가 벽 div의 맨 아래로 스크롤 될 때 ajax와 Infinite Scroll을 사용하여 HTML이 포함됩니다. <div id="wall"></div>. 이 div에는 페이지의 맨 아래와 바닥 글이 있습니다. 모든 HTML 포함은 추가되어야하고 앞으로 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"); 
    }); 

나는 경우 스크롤 아래로 경고를 얻기 위해 구걸이 코드를 시도했지만 작동하지 않습니다.

아약스 코드 :

$.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을 추가하고 앞에 추가 하시겠습니까?

페이지 하단으로 스크롤하거나 벽면 div로 스크롤 할 때 이러한 HTML에로드가 포함되어 있습니까?

Infinite Scroll with Masonry의 튜토리얼 웹 사이트를 알고 있다면 알려주십시오.

+0

당신이 – Stumblor

+0

을하시기 바랍니다 사용하고있는 플러그인'infinitescroll'의 JQuery와에 대한 링크를 게시 할 수 https://github.com/infinite-scroll/infinite- : 여기

는 작업 예제가있는 바이올린입니다 스크롤 – ind

답변

0

먼저 debug: true을 사용하면 현재 설정에 존재하는 모든 문제가 표시됩니다. 당신이 사용하고있는 HTML을 알지 못한다면, 추측하기는 어렵지만 모든 선택 자, 즉 #next#content이 존재합니까? https://jsfiddle.net/pgh49735/

관련 문제