Suspender evento predeterminado en jQuery

Question

Estoy tratando de retrasar el evento predeterminado o eventos en un script jQuery. El contexto es que quiero mostrar un mensaje a los usuarios cuando realizan ciertas acciones (haga clic principalmente) durante unos segundos antes de que se active la acción predeterminada.

pseudo-código: - El usuario hace clic elemento botón de enlace// - El usuario recibe un mensaje emergente que indica 'Usted está saliendo de sitio' - mensaje permanece en la pantalla de X milisegundos - La acción por defecto (puede ser otro que el href enlace también) dispara

hasta ahora, mis intentos se ven así:

$(document).ready(function() { 
    var orgE = $("a").click(); 
    $("a").click(function(event) { 
     var orgEvent = event; 
     event.preventDefault(); 
     // Do stuff 
     doStuff(this); 

     setTimeout(function() { 
      // Hide message 
      hideMessage(); 
      $(this).trigger(orgEvent); 
     }, 1000); 
    }); 
}); 

Por supuesto, esto no funciona como se esperaba, pero pueden mostrar lo que estoy tratando de hacer.

No puedo usar complementos ya que este es un entorno alojado sin acceso en línea.

¿Alguna idea?

Answer 1

Esto podría funcionar:

$(document).ready(function() { 
    $("a").click(function(event) { 
    event.preventDefault(); 
    doStuff(this); 

    setTimeout(function() { 
     hideMessage(); 
     $(this).click(); 
    }, 1000); 
    }); 
}); 

Nota: no probado totalmente

Answer 2

que probablemente hacer algo como esto.

$("a").click(function(event) { 
    event.preventDefault(); 
    doStuff(this); 
    var url = $(this).attr("href"); 

    setTimeout(function() { 
     hideMessage(); 
     window.location = url; 
    }, 1000); 
}); 

no estoy seguro de si url se puede ver desde el interior de la función temporizada. De lo contrario, es posible que deba declararlo fuera del controlador de clics.

Editar: Si necesita desencadenar el evento de la función de tiempo, podría utilizar algo similar a lo que sugiere karim79, aunque haría algunos cambios.

$(document).ready(function() { 
    var slept = false; 
    $("a").click(function(event) { 
    if(!slept) { 
     event.preventDefault(); 
     doStuff(this); 

     var $element = $(this); 
     // allows us to access this object from inside the function 

     setTimeout(function() { 
      hideMessage(); 
      slept = true; 
      $element.click(); //triggers the click event with slept = true 
     }, 1000); 
     // if we triggered the click event here, it would loop through 
     // this function recursively until slept was false. we don't want that. 
    } else { 
     slept = false; //re-initialize 
    } 
    }); 
}); 

Editar: Después de algunas pruebas y la investigación, no estoy seguro de que en realidad es posible disparar el evento click original de un elemento <a>. Parece ser posible para cualquier elemento que no sea <a>.

Answer 3

Algo como esto debería hacer el truco. Agregue una nueva clase (presumiblemente con un nombre más sensato que el que he elegido) a todos los enlaces que desee que se vean afectados. Elimine esa clase cuando haya mostrado su ventana emergente, de modo que cuando vuelva a llamar a .click(), su código ya no se ejecutará y se producirá el comportamiento predeterminado.

$("a").addClass("fancy-schmancy-popup-thing-not-yet-shown").click(function() { 
    if ($(this).hasClass("fancy-schmancy-popup-thing-not-yet-shown")) 
     return true; 

    doStuff(); 
    $(this).removeClass("fancy-schmancy-popup-thing-not-yet-shown"); 

    var link = this; 
    setTimeout(function() { 
     hideMessage(); 
     $(link).click().addClass("fancy-schmancy-popup-thing-not-yet-shown"; 
    }, 1000); 

    return false; 
}); 

Answer 4

Probablemente la mejor manera de hacer esto es utilizar unbind. Algo así como: