1. 简单的防抖动处理,一秒内点击一次
var timer = null;
$('.coupon').click(function(){
if (timer) {
return;
}
timer = true;
setTimeout(function() {
timer = false;
}, 1000);
...
})
2. 向服务器请求数据
点击按钮向后台请求数据 优化点:
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...
3. 封装好的简单防抖动函数
// 防抖动函数 fn要执行的函数,timeout间隔毫秒数
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;
};
}
//调用
btn.addEventListener('click', debounce(function() {
...
}, 1000));
4. 现成的工具库Loadash
http://www.css88.com/doc/loda...
防抖动:
_.debounce
节流:
_.throttle