Stop href from proceeding to next page on doubleclick event listener

Question

I have an anchor tag that links to another page, but if the user double clicks it I want to override and not let the page proceed.

<a href="{location}">My Link</a>
element.addEventListener('dblclick', (event) => event.preventDefault())

Problem is: event.preventDefault() only prevents the double click default, not the single click default.

Answer 1

Listen for the click event instead, which also fires on dblclick:

var element = document.querySelector('a')
element.addEventListener('click', (event) => event.preventDefault())

<a href="https://google.com">My Link</a>