사용자가 jQuery에서 Div의 맨 아래로 스크롤하는 경우를 감지하는 방법은 무엇입니까?

jQuery를 사용하여 사용자가 Div의 맨 아래로 스크롤할 때를 감지하는 방법

" 자동" 오버플로 설정. 사용자 경험을 향상시키기 위해 사용자가 이 div 상자의 아래쪽으로 스크롤할 때 추가 콘텐츠를 로드하려고 합니다. 그러나 특정 이벤트를 감지하는 방법은 확실하지 않습니다.

이 감지의 핵심은 특정 jQuery 속성 및 메서드를 활용하는 데 있습니다.

• $().scrollTop(): 요소가 스크롤된 픽셀 수를 나타냅니다.
• $().innerHeight(): 요소의 내부 높이를 나타냅니다.
• DOMElement.scrollHeight: 요소 콘텐츠의 높이를 반환합니다

사용자가 div의 맨 아래에 도달한 시기를 확인하려면 처음 두 속성의 합을 세 번째 속성과 비교할 수 있습니다. 이러한 값이 일치하면 div의 끝에 도달한 것입니다.

<code class="javascript">jQuery(function($) {
    $('#flux').on('scroll', function() {
        if($(this).scrollTop() + $(this).innerHeight() >= $(this)[0].scrollHeight) {
            alert('end reached');
        }
    })
});</code>

이 솔루션은 jQuery 버전 1.7의 이벤트 처리에 선호되는 on() 메서드를 사용합니다.

추가 참고 사항:

• 이벤트 리스너는 모니터링하려는 요소를 나타내는 #flux ID가 있는 div에 연결됩니다.
• 경고 () 함수는 데모 목적으로 사용됩니다. 여기에 추가 콘텐츠를 로드하기 위한 자체 로직을 포함할 수 있습니다.
• 실시간 예제는 http://jsfiddle.net/doktormolle/w7X9N/에서 찾을 수 있습니다.

위 내용은 사용자가 jQuery에서 Div의 맨 아래로 스크롤하는 경우를 감지하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!