使用jqMobi開發app基礎：Scrolling的使用，停止和繼續拖動有關的問題 · jqMobi開發app基礎

?在使用Scrolling開發app的過程中，遇到了很多問題，demo給的例子是下拉永遠有數據的情況，而我的數據是有限的，也就是下拉一定次數后，下拉實際上就沒有新數據，也就是不需要再繼續下拉了。當上拉刷新數據后，才可以繼續下拉。本以為只需要添加一個判斷就可以了，誰知道當下拉到沒有數據后，再上拉刷新，然后下拉竟然下拉不了了！！具體代碼參考http://blog.csdn.net/xuexiaodong009/article/details/18794909 核心代碼精簡如下： ~~~ var myScroller; var hasMorePage = true; myScroller = $("#" + listPaneId).scroller(); myScroller.addInfinite(); myScroller.addPullToRefresh(); $.bind(myScroller, 'scrollend', function () { // console.log("scroll end"); 目前未使用 }); $.bind(myScroller, 'scrollstart', function () { // console.log("scroll start");目前未使用 }); $.bind(myScroller, "refresh-trigger", function () { // console.log("refresh-trigger");目前未使用 }); $.bind(myScroller, "refresh-release", function () { hasMorePage = true;//默認可以可以下拉 //清空原來的數據，通過ajax重新加載第一頁的數據 }); $.bind(myScroller, "refresh-cancel", function () { // console.log("refresh-cancel");目前未使用 }); $.bind(myScroller, "refresh-finish", function () { // console.log("refresh-finish");目前未使用 }); myScroller.enable(); $.bind(myScroller, "infinite-scroll", function () { ? var self = this; if (!hasMorePage) {//沒有數據了，則直接返回，不在下拉 // self.clearInfinite(); return; } $(this.el).append("<div id='infinite' style='height:60px;line-height:60px;text-align:center;font-weight:bold'>正在讀取數據</div>"); $.bind(myScroller, "infinite-scroll-end", function () { $.unbind(myScroller, "infinite-scroll-end"); self.scrollToBottom(); //通過ajax讀取數據，再返回數據后，判斷是否還有多余的數據，設置標志量hasMorePage }); }); ~~~ 沒有辦法只能一步步測試，首先放開console.的注釋，發現，可以下拉時會觸發infinite-scroll事件，可是我改動后，下拉時根本就觸發不了infinite-scroll事件了，自然也就不能下拉刷新數據了。然后打開af.scroller.js文件，查找和觸發infinite-scroll事件有關的代碼，找到幾處代碼，一處如下： ~~~ if (this.infinite && !this.infiniteTriggered) { if ((Math.abs(scrollInfo.y) >= (this.el.clientHeight - this.container.clientHeight))) { var self = this; setTimeout(function(){ self.infiniteTriggered = true; $.trigger(self, "infinite-scroll"); },scrollInfo.duration-50); } } ~~~ 發現要觸發infinite-scroll事件，都要判斷this.infinite，this.infiniteTriggered，再進一步調試，發現之所以不再觸發是因為this.infiniteTriggered變量的值不對。然后再看看有沒有修改this.infiniteTriggered變量的值值得方法，最終找到了clearInfinite方法。知道了原因修就很簡單了，只需要添加一行代碼。 ~~~ if (!hasMorePage) {//沒有數據了，則直接返回，不在下拉 self.clearInfinite();//添加的一行代碼 return; } ~~~ ?