在 HTML 的移動網頁瀏覽器上下拉重新整理。


當需要下拉螢幕以重新整理頁面以獲取最新更新時,可以使用 JavaScript、xhttprequest 然後進行觸控事件操作來完成此操作。

下拉重新整理是 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's height is > than content wrapper'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
};

更新於: 2020 年 6 月 24 日

776 次瀏覽

開啟你的 職業生涯

完成課程獲得認證

開始
廣告