摘要:簡單的防抖動處理,一秒內(nèi)點(diǎn)擊一次向服務(wù)器請求數(shù)據(jù)點(diǎn)擊按鈕向后臺請求數(shù)據(jù)優(yōu)化點(diǎn)另外一些防抖動的小技巧,請參考封裝好的簡單防抖動函數(shù)防抖動函數(shù)要執(zhí)行的函數(shù),間隔毫秒數(shù)調(diào)用現(xiàn)成的工具庫防抖動節(jié)流
1. 簡單的防抖動處理,一秒內(nèi)點(diǎn)擊一次
var timer = null; $(".coupon").click(function(){ if (timer) { return; } timer = true; setTimeout(function() { timer = false; }, 1000); ... })2. 向服務(wù)器請求數(shù)據(jù)
點(diǎn)擊按鈕向后臺請求數(shù)據(jù) 優(yōu)化點(diǎn):
var running = false; $(".btn").on("click", function() { if (running) { return; } running = true; $.ajax(url, { complete: () => { running = false; } }) });
另外一些防抖動的小技巧,請參考:
http://blog.csdn.net/crystal6...;
https://jinlong.github.io/201...
// 防抖動函數(shù) fn要執(zhí)行的函數(shù),timeout間隔毫秒數(shù)
function debounce(fn, timeout) { let last = null; return function() { if (last) { return last.result; } setTimeout(() => { last = null; }, timeout || 1000); const result = fn.apply(this, arguments); last = { result }; return result; }; } //調(diào)用 btn.addEventListener("click", debounce(function() { ... }, 1000));4. 現(xiàn)成的工具庫Loadash
http://www.css88.com/doc/loda...
防抖動:
_.debounce
節(jié)流:
_.throttle
文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址:http://systransis.cn/yun/52519.html
摘要:簡單的防抖動處理,一秒內(nèi)點(diǎn)擊一次向服務(wù)器請求數(shù)據(jù)點(diǎn)擊按鈕向后臺請求數(shù)據(jù)優(yōu)化點(diǎn)另外一些防抖動的小技巧,請參考封裝好的簡單防抖動函數(shù)防抖動函數(shù)要執(zhí)行的函數(shù),間隔毫秒數(shù)調(diào)用現(xiàn)成的工具庫防抖動節(jié)流 1. 簡單的防抖動處理,一秒內(nèi)點(diǎn)擊一次 var timer = null; $(.coupon).click(function(){ if (timer) { return; } ...
摘要:防抖動節(jié)流節(jié)流使得一定時間內(nèi)只觸發(fā)一次函數(shù)。它和防抖動最大的區(qū)別就是,節(jié)流函數(shù)不管事件觸發(fā)有多頻繁,都會保證在規(guī)定時間內(nèi)一定會執(zhí)行一次真正的事件處理函數(shù),而防抖動只是在最后一次事件后才觸發(fā)一次函數(shù)。 防抖動與節(jié)流 針對一些會頻繁觸發(fā)的事件如scroll、resize,如果正常綁定事件處理函數(shù)的話,有可能在很短的時間內(nèi)多次連續(xù)觸發(fā)事件,十分影響性能。所以我們對于這種事件我們要進(jìn)行防抖動或...
摘要:它和防抖動最大的區(qū)別就是,節(jié)流函數(shù)不管事件觸發(fā)有多頻繁,都會保證在規(guī)定時間內(nèi)一定會執(zhí)行一次真正的事件處理函數(shù)。 防抖動 其核心內(nèi)涵在于延遲處理,也就是將一系列的事件處理程序全部延遲,保障推送進(jìn)來的第一次事件處理 var debounce = function(fn,delay,mustRunDelay){ var timer = null; var t_start; ...
摘要:起因面試被問到了節(jié)流和防抖動自己對這兩個的概念比較模糊都不知道回答了什么鬼從語文和英語學(xué)起首先先看字面意思節(jié)流的意思就是水龍頭關(guān)小點(diǎn)頻率不要那么高防抖動這根彈簧你不要來回蹦了我就要你最后停下來的沒有發(fā)生形變的那一刻舉個例子節(jié)流在改變窗口大小 起因 面試被問到了節(jié)流和防抖動, 自己對這兩個的概念比較模糊, 都不知道回答了什么鬼 從語文和英語學(xué)起 首先, 先看字面意思:節(jié)流(throttl...
閱讀 2081·2023-04-25 17:48
閱讀 3590·2021-09-22 15:37
閱讀 2943·2021-09-22 15:36
閱讀 6016·2021-09-22 15:06
閱讀 1646·2019-08-30 15:53
閱讀 1438·2019-08-30 15:52
閱讀 720·2019-08-30 13:48
閱讀 1130·2019-08-30 12:44