如题目,我想实现一个input框的onClick功能,click事件中有两个事件,其中一个事件正常触发,另一个事件想做防抖.请问该怎么实现.
var timeout=null
dom.onclick = function () {
//事件一
console.log('事件一正常调用');
//事件二 需要做防抖的
if (timeout) {
clearTimeout(timeout);
}
timeout = setTimeout(function (e) {
console.log('处理事件二');
}, 2000)
}
点击事件点一次事件一就会执行一次,然后事件二是二秒执行执行一次,就是说二秒内点在快,也只是执行一次
click事件里调用另一个事件不就好了
先去看看什么是防抖,看懂了就会了
// 正常事件1
function event1() {
console.log('event1');
}
// 事件2
function event2() {
console.log('event2');
}
// 将事件二改为加上防抖 // debounce 是你自己的防抖
const debounceEvent = _.debounce(event2, 1000)
// 点击事件
function onClick() {
event1();
debounceEvent();
}
function debounce(fn,delay){
var timer=null;
return function(){
if(timer) clearTimeout(timer);
timer=setTimeout(()=>{
fn.apply(this,arguments);
timer=null;
},delay)
}
}
dom.onclick = function () {
console.log('事件一');
debounce(()=>console.log('事件二'),2000)();
}
您好,我是有问必答小助手,您的问题已经有小伙伴解答了,您看下是否解决,可以追评进行沟通哦~
如果有您比较满意的答案 / 帮您提供解决思路的答案,可以点击【采纳】按钮,给回答的小伙伴一些鼓励哦~~
ps:问答VIP仅需29元,即可享受5次/月 有问必答服务,了解详情>>>https://vip.csdn.net/askvip?utm_source=1146287632