Como activar un enlace web pasado un tiempo determinado con javascript

Como activar un enlace web pasado un tiempo determinado con javascript

0
(0)

¿La tasa de rebote de tu página web es un quebradero de cabeza?

¿Tienes un recurso que la gente quiere descargar y te gustaría incrementar el tiempo de permanencia media en tu web?

Javascript puede acudir en tu ayuda. Tal vez sea un poco de #blackHat … pero google no se enterará. O si.

¿sientes curiosidad?

En esta publicación explico como hacerlo con un ejemplo que suelo usar en clase de web para explicar el uso de addEventListener(), removeEventListener()y preventDefault()

El código html

El código html usado para este ejemplo es simple.

Un enlace sin nada en especial.

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>preventDefault()</title>
	<meta name="author" content="francesc ricart"/>
</head>
<body>
	
<a href="https://francescricart.com/tutorial-javscript" id="enlace">Enlace que se activa pasados 2 segundos de cargarse la página</a>

</body>
</html>

preventDefault() , addEventListener() , removeEventListener()

Cuando se carga la página asignamos un evento de tipo click que inhabilita el funcionamiento normal del enlace.

Asignamos también un setTimeout que se dispara pasados 2 segundos.

Llegado este intervalo de tiempo se dispara una función que elimina la función que inhabilitaba el funcionamiento normal del enlace.

En realidad en ningún caso estamos habilitando o inhabilitando el enlace sino que lo que estamos haciendo es jugar con añadir un addEventListener o quitarlo.

var zEnlace = document.getElementById("enlace");

window.addEventListener("load",inicializar);

function inicializar(){
zEnlace.addEventListener("click",pararEvento);
setTimeout(eliminarPararEvento,2000)
}

function pararEvento(zE){
	var zEvento = zE || window.event;
	zEvento.preventDefault()
}

function eliminarPararEvento(){
	zEnlace.removeEventListener("click",pararEvento);
}

¡Hola!

Querido lector,

Si quieres repasar la teoría relacionada con los conceptos explicados en este ejercicio tal vez sea interesante leer estas lecturas:

¡Si te ha gustado este contenido te animo a seguirme en mi perfil de empresa de Linkedin!

¿Te ha gustado esta publicación?

¡Valora sobre 5 estrellas esta publicación!

Puntuación media 0 / 5. Votos: 0

Todavía no hay votos. Sé el primero en valorar la entrada.

Si te ha gustado este contenido...

¡Sígueme en las redes!

Vaya, parece que hay puntos a corregir

¿Me ayudas a mejorar?

¿Dónde he fallado?

Francesc Ricart
hola@francescricart.com

Aprender y enseñar. Enseñar y aprender. En el ámbito docente soy docente ocupacional. En el ámbito profesional consultor web. Ofrezco servicios de mejora continua y mantenimiento web. ¿Qué quieres aprender hoy? Encontraréis más acerca de mi en la página sobre mi

No Comments

Post A Comment