2013-04-17 3 views
1

내 웹 사이트에서 무한 스크롤을 사용하고 있습니다. 내 모바일 웹 사이트에서도 동일하게 사용하고 싶었지만 jquery-mobile을 포함하자 마자 작동이 멈 춥니 다.jquery-mobile으로 무한 스크롤하기

잘 작동합니다. 포인터가 있습니까?

세부 사항 : 나는 폴 아일랜드 인의 무한한 두루마리를 사용하고있다. 초기화는 오류를 발생시키지 않지만 동시에 다음 페이지를로드하지 않습니다 (페이지의 맨 아래에 도달하면 아약스 호출을하지 않습니다).

나는 베어 뼈 사이트 here

+0

무한 스크롤이란 무엇입니까? jQuery Mobile 버전? 이 문제를 해결하기 위해 무엇을 했습니까? – Gajotres

+0

HTML과 코드를 표시 할 수 있습니까 ??? –

+0

@ Borsel가 세부 정보를 추가했습니다. –

답변

0

내가 너무 늦기하지만 항상 늦게 결코보다 잘 알고을 뒀다.
다음 setInfifniteScroll() 함수를 사용하여 페이지에 무한 스크롤을 설정할 수 있습니다. 당신은

$(document).ready(function(){ 
    setInfifniteScroll(scrollingDivId); // Here instead of scrollingDivId you can pass window object 
}); 

Paulirish 무한 스크롤 JS는 다음 페이지의 URL을 계산하는 그것의 몇 가지 미리 정의 된 알고리즘을 가지고 있으며, 여러분의 URL이 일치하지 않는 경우는하지 않습니다 문서 준비 함수 내에서 직접이 기능이나 복사 기능 코드를 호출 할 수 있습니다 다음 페이지로 전화하십시오. 그러므로 나는 다음 페이지를 부를 URL을 수정했다.
첫 번째 페이지의 콘텐츠를로드 한 다음 두 번째 페이지에서 무한 스크롤이 작동합니다. 모든 페이지에 대해 하나의 특정 경로를 유지해야합니다. 아래 주어진 예제는 내 URL에? page = pageNumber를 추가했습니다.

function setInfifniteScroll(scrollingDivId){ 
    $('#scrollingDivId').infinitescroll({ 
     state: { 
      currPage: 2 , 
      isDestroyed: false, 
      isDone: false  
     }, 
     loading: { 
      finishedMsg: "<em>No more content to load. You have reached to end.</em>", 
      img: "image/loader.gif", 
      speed: 'fast', 
      msgText: "<em>Loading the next set of content...</em>", 
      delay : 1 
     }, 
     navSelector  : "#navId", 
     nextSelector  : "#navId a", 
     itemSelector  : ".itemselector", // it is element class to catch from your response 
     debug   : false, 
     dataType  : 'html', 
     path: function(pageNumber) { 
      var url = $("#navId a").attr("href"); 
      pageNumber = parseInt(url.substring(url.lastIndexOf("page=")+5, url.length)) + 1; 
      $("#navId a").attr("href","nextPageUrl_append with?page=" + pageNumber); 
      return url; 
     }, 
    }, function(newElements, data, url){ 
     // You can perform operations on data 
    }); 
} 
관련 문제