사용자가 현재 문서의 끝 부분에 있음을 알 수있는 방법

Question

실례 : 안녕하세요. 나는 내 질문의 제목에 너희들을 혼란스럽게하지 않기를 바란다.

배경 : 내가 원하는 것은 실제로 사이트의 콘텐츠를 업데이트하는 것입니다. 나는 Stackoverflow뿐만 아니라 구글 전체에 infinite-scroll 같은 일부 플러그인에 대해 들었다. 그러나 나는 그것을 위해 어떤 플러그인도 사용하고 싶지 않다. 그때 내가 발견 한 것은 문서에서 사용자의 현재 위치를 감지하는 순수한 jQuery 코드였다. 즉 이런 식입니다 :

$(window).scroll(function() { 
if($(window).scrollTop() + $(window).height() == $(document).height()) { 
    alert("bottom!"); 
} 
}); 

내가 무엇을 발견 :

나는 여기에이 코드를 발견 Check if a user has scrolled to the bottom

을 그래서 내가 유래에 대한 모든 질문을 읽고 이미 한 것을 의미한다.

문제점 : 위의 코드는 올바로 작동하지 않는 것이 문제입니다. 내가 사용하는 경우에만 작동합니다 : == $(document).height() 사용자가 문서의 끝에있을 때 코드를 실행하기 때문입니다. 일단 나는 같은 것을 사용하려고 시도 : $(document).height() - 100 또는 그런 건. 작동하지 않습니다. 나는 문서의 끝까지 가야한다. 그리고 내가 되돌아 올 때 그것은 경고를 보여준다! 그것은 사용자에게는 거의 없을 것입니다.

나는 또한 unbind('scroll')을 시도했지만 경고를 통해 코드 실행이 중지됩니다! 즉, 사용자에게 한 번만 경고하므로 간접적으로 사용자의 데이터를 한 번로드하고 더 많은 데이터를 다시로드하는 것을 중지합니다.

그래서 여기서 질문하는 것이 더 좋은 아이디어라고 생각했습니다. 화면 상에 사용자의 존재를 알 수있는 간단한 jQuery 코드를 얻을 수 있습니까? 그리고 많은 데이터를 한번 사용하면, 왜냐하면 내가 > $(document).height()을 사용하면 팝업을 계속 보여 주지만 요청이 이루어지면 팝업을 표시하지 말고 팝업을 다시 보여 주어야합니다!

또는 간단한 단어에서

:

또는 다른 말로하면, 내가 원하는 사용자가 아래로 길 아래로 80 %를 간 때 그가 거의 95 %에 도달하므로 때 요청이되어야한다는 것입니다 페이지의 일부분에 데이터가 놓여져 있고 그것을 볼 수 있고 다시 80 %가되면 요청이 내려집니다. 등등! 이 부분은 이해하기 쉽습니다.

$(window).scroll(function() { 
    if($(window).scrollTop() + $(window).height() == $(document).height()) { 
     alert("Sending ajax request!"); 
     $.ajax({ 
     url: "ajax_requests/send_email_digest", 
     success: function (data) { 
      // show the data..if any 
     } 
     }); 
    } 
}); 

을하지만이되지 않습니다 :

이 작품 사용

$(window).scroll(function() { 
    if($(window).scrollTop() + $(window).height() == 
    $(document).height() - 100) { 
     alert("Sending ajax request!"); 
     $.ajax({ 
     url: "ajax_requests/send_email_digest", 
     success: function (data) { 
     // show the data..if any 
     } 
    }); 
    } 
}); 

Answer 1

나는 스크롤 기능을 사용하면 스크롤 모든 픽셀이라고 생각하지 않습니다. 당신은 if 문이에 일치를 얻을 운이해야

if($(window).scrollTop() + $(window).height() == $(document).height() - 100) 

나는 사용자가 페이지의 하단 20 %에 당신이 세계를 사용할 수있는 경우 탐지와 해결해야 할 것 같아요 변수가 실행 중일 때 ajax 요청을 확인합니다.

var requesting = false; 
$(window).scroll(function() { 
    if(!requesting && 
     (($(window).scrollTop() + $(window).height()) >= ($(document).height() * 0.8))) { 
     requesting = true; 
     alert("Sending ajax request!"); 
     $.ajax({ 
     url: "ajax_requests/send_email_digest", 
     success: function (data) { 
     // show the data..if any 
     } 
    }).done(function(){ 
     requesting = false; 
    }); 
    } 
});