Enlace diferentes eventos para hacer clic y hacer doble clic | Programar Plus

Es posible que desee que un enlace tenga una acción especial cuando se hace doble clic, lo que evita la acción predeterminada del enlace (ir a otra página). Entonces:

Doble clic: hace algo especial, no hace ningún evento de clic normal
Haga clic: funciona normalmente

Necesitará un retraso muy leve para activar la acción de clic normal, que cancela cuando ocurre el evento de doble clic.

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();
  });
Check out this Pen!
(Visited 3 times, 1 visits today)