2012-08-08 5 views
2

나는이 무한 스크롤 스크립트가 내가 원하는 방식으로 작동하도록 노력하고있다. 그러나 내가 어떻게 알아낼 수 없습니다, 어떤 게시물은 loadmore.php 파일에 새로운 발견, 그래서 그것은 이미 페이지에 게시물을 표시하지 않습니다?무한 스크롤

<script type="text/javascript"> 
$(window).scroll(function() 
{ 
    if($(window).scrollTop() == $(document).height() - $(window).height()) 
    { 
        $('div#loadmoreajaxloader').show(); 
        $.ajax({ 
        url: "loadmore.php", 
        success: function(html) 
        { 
            if(html) 
            { 
                $("#postswrapper").append(html); 
                $('div#loadmoreajaxloader').hide(); 
            }else 
            { 
                $('div#loadmoreajaxloader').html('<center>No more posts to show.</center>'); 
            } 
        } 
        }); 
    } 
}); 
</script> 

답변

5

게시물이 새로운 것인지 파악하지 마십시오. 자바 스크립트에서 마지막으로로드 된 게시물 (ID 또는 기타 방법을 통해)을 알고 있는지 확인한 다음 'loadmore.php'스크립트로 전송하십시오.

웹 서비스 (loadmore.php)는 상태를 유지해야하며 프론트 엔드 (javascript)는 상태 (마지막으로로드 된 ID)를 알아야합니다.

1

글쎄, 간단히 말해서 : 그 정보를 저장해야합니다. 로드하려는 정보에 어떤 순서가 있다고 가정하면 마지막으로 마지막으로 반환 된 ID를 저장하고 PHP 스크립트에서 새 정보의 시작점으로 해당 정보를 전달할 수 있습니다.

+1

질문의 전체 텍스트를 인용하는 것은 약간 불필요한가요? – DaveRandom

+0

@DaveRandom입니까? 나는 그저 익숙해 진 것 같아. 사람들을 괴롭 히면 나는 그것을 제거 할 것이다. –

+0

예, 여기는 단지 필요하지 않습니다. 그래서 여러 페이지에 걸쳐 많은 답변이있을 때도 모든 페이지에서 질문을 볼 수 있도록 설계되었습니다. 그래서 당신의 전형적인 포럼이 아닙니다. * 포럼이 아닙니다. – DaveRandom

0

왜 클라이언트에서로드하려고하는 요소 목록의 마지막 ID 또는 마지막 타임 스탬프가 포함되어있는 변수를 만들지 않습니까? 이 값을 서버에 전달하면 PHP 파일에서이 값을 사용할 수 있습니다.

매우 일반적인 예가 마지막으로 찍은 타임 스탬프입니다. 몇 가지 새로운 피드가 필요할 때이 타임 스탬프를 서버에 보내면 이번에는 그 다음으로 오래된 다음 5 개의 피드가 걸립니다.

+0

어떻게 처리하나요? –

0

이렇게하는 가장 좋은 방법은 피드를 생성 할 수있는 페이지를 만드는 것입니다. 오프셋, 그리고 그것은 새로운 게시물에 대한 쿼리 것입니다. 이것은 내가 워드 프레스에서이 작업을 수행 한 방법입니다 http://yourwebsite.com/more/?offset=20

  • 그런 다음 오프셋 얻고 오프셋과 쿼리를 실행

    1. 는 페이지 오프셋 (URL)를 공급되어 있는지 확인합니다.
    2. 그럼 당신은 동일한 결과 중 하나를 필요가 없습니다 ...

    나는이 모호한 소리로 들리 겠지만 -을 살펴 가지고 케어 - 그래서 코드와 튜토리얼을 썼다? http://benjaminpotter.org/infinite-scroll/

  • +0

    그 기사에 대한 링크가 아직 있습니까? 그 하나는 더 이상 작동하지 않습니다 ... –

    +1

    반드시하십시오! @LonGaban - http://benpotter.me/infinite-scroll/을 확인하십시오. –