双击事件失效解决办法

某些时候,双击事件会失效,模拟办法解决双击失效后,而同时我又不想在该元素上触发两次单击事件,解决办法如下:

var dbclickTime={
prev:0, next:0//模拟触发双击
};
var clickConflict={//解决单击事件和双击事件的冲突
_timeout:null,
set:function (fn) {
this.clear();
this._timeout=window.setTimeout(fn,400);
},
clear:function () {
if(this._timeout){
window.clearTimeout(this._timeout);
this._timeout=0;
}
}
};

//code 事件托管
document.addEventListener("click",function (e) {
if(dbclickTime.prev==0){
dbclickTime.prev=dbclickTime.next=new Date().getTime();
}else{
dbclickTime.prev=dbclickTime.next;
dbclickTime.next=new Date().getTime()
}

if(true){//托管的元素
clickConflict.set(function () {
          console.log("click");
          //do something
        });
}

if(dbclickTime.next-dbclickTime.prev<300){
console.log("dblick");
clickConflict.clear();
if(true){//托管的元素
//do something
}
}
},true);
posted @ 2017-05-19 12:05  callmeguxi  阅读(694)  评论(0编辑  收藏  举报