最近的一個case,在web頁下,鼠標向下滾動翻頁動態請求數據的時候。一般都是判斷當前頁面距離頂部的高度與整個html的長度之差來決定是否請求下一頁的數據。
如果不進行相應處理,滑動事件會觸發多次,導致請求多次或者重復請求(取決於代碼設計)
思路1: 滑動到下方第一次觸發請求后,移除滑動監聽,等待請求返回,繼續監聽滑動事件。
思路2: 對於一次滑動有產生多次不重復的請求的情況。可以讓這些請求都進入隊列,滑動時判斷標志位,為真則取出隊列第一個請求並執行,為假則不執行。待請求返回時設置標志位true。具體如下:
// 在異步請求返回處加上下面這句 oneRequest.setResolve("functionname"); //在產生重復請求處寫上 oneRequest.singleRequest(functionname,[param1,param2,param3]); functionname 函數中必定是一個異步請求。 var single = function(){ this.paramList = []; this.callfun = true; this.id = 0; } single.prototype.duplicateRequest = function(callback, params){ this.paramList.push({"Funcname": callback.name, "params": params}); if(this.callfun){ callback(this.paramList[this.id++].params); this.callfun = false; } } single.prototype.setResolve = function(res){ if(res === false){ this.callfun = false; }else { this.callfun = true; } } var oneRequest = new single();