Sometimes, we want to differentiate single click event and double click event with JavaScript.
In this article, we’ll look at how to differentiate single click event and double click event with JavaScript.
How to differentiate single click event and double click event with JavaScript?
To differentiate single click event and double click event with JavaScript, we can use the detail property.
For instance, we write
element.onclick = (event) => {
if (event.detail === 1) {
// ...
} else if (event.detail === 2) {
// ...
}
};
to add an click listener to element.
In the onclick method, we check if details is 1 or 2.
If it’s 1, then it’s a single click.
If it’s 2, then it’s a double click.
Conclusion
To differentiate single click event and double click event with JavaScript, we can use the detail property.