2017-04-06 2 views
1

$.mobile.changePage() 메소드를 사용하여 jQuery Mobile 사이트에서 페이지 1에서 페이지 2로 이동합니다. 페이지 1과 페이지 2는 화면보다 큽니다. 페이지 1은 긴 항목의 목록보다 훨씬 길지만 Page 2 Page 1입니다. 사용자가 항목을 탭하면 ajax를 통해 페이지 2의 내용을로드하고 해당 내용을 본문에 추가 한 다음 changePage()을 사용하여 2 페이지로 전환합니다.jQuery Mobile : 전환 후 페이지 스크롤 다운

사용자가 페이지 1의 목록을 아래로 스크롤 한 다음 페이지 2로 전환하면 페이지 2의 가변 양이 창 아래로 스크롤됩니다. 2 페이지에서 스크롤 된 거리는 거리와 관련이있는 것으로 보입니다 사용자가 이전에 페이지 1을 스크롤했습니다.

$.mobile.silentScroll(0);$('body').scrollTop('0');을 사용해 보았지만 성공하지 못했습니다.

어떻게 2 페이지 내가 전에이 같은 문제가 발생했습니다

답변

1

아래로 스크롤에서 변경 페이지의 방지 방법에 대해 갈 수 있습니다.

$.mobile.pageContainer.on("pagecontainerchange", function(event, ui) { 
    $(document).scrollTop(0); 
}); 

여기 document.scrollTop()을 수행하는 중요한 차이점 대신 : 당신이 할 수있는 것은 페이지 변경이있을 때마다 호출되는 이벤트 핸들러를 생성하고이 그 기능 스크롤을 페이지 상단에 있습니다 body.

제 코드에서는이 작은 예제를 좀 더 정교하게 만들었습니다. 각 페이지의 세로 스크롤 위치를 기록한 다음 페이지 DOM 요소에 저장하고 사용자가 페이지로 돌아올 때 세로 스크롤 위치를 복원합니다. 그런 식으로 사용자는 항상 페이지의 맨 위로 스크롤되는 대신 중단 된 위치로 되돌아갑니다.

관련 문제