HTML의 모바일 웹 브라우저에서 아래로 당겨 새로 고침

최신 업데이트를 받기 위해 화면을 아래로 당겨 페이지를 새로 고쳐야 하는 경우 JavaScript, xhttprequests 및 터치 이벤트를 사용하여 수행할 수 있습니다.

Pull-to-refresh는 AJAX에서 XHR의 트리거입니다. 우리가 원하는 요소에 새로운 데이터를 추가합니다.

당겨 새로 고침은 JavaScript 스크롤 메커니즘(예: iscroll)을 하이재킹하여 달성할 수 있습니다. Twitter는 풀다운 새로 고침 옵션을 구현하기 위해 iscroll을 사용하고 있습니다.

또 다른 방법은 overflow:scroll 구성 요소에 대한 새로 고침 핸들러를 만드는 것입니다.

제공된 인터페이스는 핸들러 인터페이스에 대한 아이디어를 제공할 수 있습니다 −

var PullToRefresh= function(callback, wrapper, instructionsText) {

   //It creates dom elements and append them before content wrapper  
   
   // <div class="mainWrapper" style="overflow: scroll; height: 600px;">
   <div class="pullToReloadWrapper"></div><div class = "contentWrapper"></div>
   </div> is the markup.
   
   // if main wrapper&#39;s height is > than content wrapper&#39;s
   height, then change the main wrapper height to be the height of the content wrapper.
   
   // scroll main wrapper.
   // invoke initializeEvents() to inititalize the events
};

위 내용은 HTML의 모바일 웹 브라우저에서 아래로 당겨 새로 고침의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!