Bind verschillende gebeurtenissen om te klikken en te dubbelklikken - CSS-trucs

Anonim

U wilt misschien dat een link een speciale actie heeft wanneer u erop dubbelklikt, waardoor de standaardactie van de link wordt voorkomen (ga naar een andere pagina). Zo:

Dubbelklik: doet iets speciaals, doet helemaal geen normale klikgebeurtenis.
Klik: werkt zoals normaal

U moet een zeer kleine vertraging hebben bij het activeren van de normale klikactie, die u annuleert wanneer de dubbelklikgebeurtenis plaatsvindt.

function doClickAction() ( $("#click h2").append("•"); ) function doDoubleClickAction() ( $("#double-click h2").append("•"); ) var timer = 0; var delay = 200; var prevent = false; $("#target") .on("click", function() ( timer = setTimeout(function() ( if (!prevent) ( doClickAction(); ) prevent = false; ), delay); )) .on("dblclick", function() ( clearTimeout(timer); prevent = true; doDoubleClickAction(); ));
Kijk eens naar deze pen!