1: Principle:
Let’s first look at the execution order of the click event:
Click (click): mousedown, mouseout, click;
Double-click (dblclick): mousedown, mouseout, click, mousedown, mouseout, click, dblclick;
In the double-click event (dblclick), the first click event (click) will be blocked, but the second time will not. That is to say, the double-click event (dblclick) will return a single click event (click) result and a single double-click event (dblclick) result. Instead of a double-click event (dblclick) result and a two-click event result (click).
In this case, the problem is solved by simply eliminating the extra click event (click).
setTimeout
Two: Code:
//Define the setTimeout execution method
var TimeFn = null;
$('div').click(function () {
// Cancel the method that was not executed last delay
clearTimeout(TimeFn);
//Execution delay
TimeFn = setTimeout(function(){
//do function write the code to execute the click event here
},300);
});
$('div').dblclick(functin () {
// Cancel the method that was not executed last delay
clearTimeout(TimeFn);
//Double click on the execution code of the event
})
Let’s first look at the execution order of the click event:
Click (click): mousedown, mouseout, click;
Double-click (dblclick): mousedown, mouseout, click, mousedown, mouseout, click, dblclick;
In the double-click event (dblclick), the first click event (click) will be blocked, but the second time will not. That is to say, the double-click event (dblclick) will return a single click event (click) result and a single double-click event (dblclick) result. Instead of a double-click event (dblclick) result and a two-click event result (click).
In this case, the problem is solved by simply eliminating the extra click event (click).
setTimeout
Two: Code:
Copy the codeThe code is as follows:
//Define the setTimeout execution method
var TimeFn = null;
$('div').click(function () {
// Cancel the method that was not executed last delay
clearTimeout(TimeFn);
//Execution delay
TimeFn = setTimeout(function(){
//do function write the code to execute the click event here
},300);
});
$('div').dblclick(functin () {
// Cancel the method that was not executed last delay
clearTimeout(TimeFn);
//Double click on the execution code of the event
})