JavaScript - Duda con eventos en javascript

 
Vista:
sin imagen de perfil
Val: 3
Ha aumentado su posición en 13 puestos en JavaScript (en relación al último mes)
Gráfica de JavaScript

Duda con eventos en javascript

Publicado por Meneth (5 intervenciones) el 03/12/2020 16:36:44
Hola
Tengo el siguiente código
1
2
3
4
5
6
7
8
9
10
11
12
window.addEventListener("load",
	()=>{
			let enlaces=document.querySelectorAll("a");
			for(let i=0;i<enlaces.length;i++){
				enlaces[i].addEventListener("click",
					()=>{
						let parrafo=enlaces[i].previousElementSibling;
						parrafo.style.display="none";
					});
			}
 
});

El objetivo del ejercicio es hacer "desaparecer" un párrafo cuando hago click en un enlace. El código funciona perfectamente si cambio

1
enlaces[i].addEventListener("click",

por

1
enlaces[i].addEventListener("mousemove",

pero en este caso solo funciona si en lugar de hacer click paso el ratón por encima del enlace

Mi pregunta es ¿por qué cada vez que hago click en el enlace me recarga la página y es como si el código no funcionase?
Me refiero, el código del click funciona, pero solo durante un segundo porque al clickear el enlace me recarga la página entera...
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
Imágen de perfil de Alejandro
Val: 1.448
Plata
Ha mantenido su posición en JavaScript (en relación al último mes)
Gráfica de JavaScript

Duda con eventos en javascript

Publicado por Alejandro (532 intervenciones) el 03/12/2020 20:08:54
  • Alejandro se encuentra ahora conectado en el
  • chat de PHP
Puede ser que tengas algo como esto:
1
<a>Enlace</a> <a href="">Enlace</a>

Tienes 2 opciones:
1) Agregar el preventDefault() para evitar su comportamiento natural.
1
2
3
4
5
6
7
enlaces[i].addEventListener("click",
	(e)=>{
		e.preventDefault();
		let parrafo=enlaces[i].previousElementSibling;
		parrafo.style.display="none";
	}
);

2) Poner # al href para que no envié a ningún lado.
1
<a href="#">Enlace</a>
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
1
Comentar
sin imagen de perfil
Val: 3
Ha aumentado su posición en 13 puestos en JavaScript (en relación al último mes)
Gráfica de JavaScript

Duda con eventos en javascript

Publicado por Meneth (5 intervenciones) el 03/12/2020 20:27:52
Muchas gracias por responder.
Me ha funcionado.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar