evitar que el navegador brinque

[rogeliomx]

hola que tal estoy haciendo una plantilla html y he notado que al crear vinculos <a></a> cuando les pongo el atributo href="#" al clickearlos el navegador brinca hacía arriba, como puedo evitar este comportamiento.

[Carlangueitor]

Pues no le pongas "#".


Saludos

[rogeliomx]

si no le pongo #, me reinicia el navegador lo cual es peor, estoy usando el vinculo con javascript para hacer consultas asincronas, entonces pues la vdd no se como hacer para evitar ese brinco ya que da un efecto muy feo.

[carscx]

<a href="#" onclick="return false;">Enlace</a>

Si tienes demasiados enlaces, con jQuery puedes seleccionarlos todos los que tengan "#" y aplicar el return false.

Saludos,

[jonni09lo]

Debes de "prevenir" la acción del link, si usas jQuery es:

Código Javascript:

$(selector).click(function(e){
    e.preventDefault();
    //operaciones
});
 

Si usas javascript puro:

Código Javascript:

document.getElementById('milink').addEventListener('click',function(event){
****event.preventDefault ? event.preventDefault() : event.returnValue = false;
    //operaciones
});
 

Saludos

[jonni09lo]

Iniciado por carscx

<a href="#" onclick="return false;">Enlace</a>

Si tienes demasiados enlaces, con jQuery puedes seleccionarlos todos los que tengan "#" y aplicar el return false.

Saludos,

No siempre es una buena practica usar return false...

Si sabes que preventDefault() stopPropagation() y return false funcionan de maneras distintas, no?

Saludos

[Carlangueitor]

No habías dicho que se trataban de consultas ajax, entonces si como te han dicho lo correcto es cancelar la opción del botón con preventDefault() como ya te han dicho.


Saludos

[carscx]

Iniciado por jonni09lo

No siempre es una buena practica usar return false...

Si sabes que preventDefault() stopPropagation() y return false funcionan de maneras distintas, no?

Saludos

No sabia muy bien la diferencia entre uno y otro, siempre los use de manera distinta, con prevent default he tenido algunos problemas en IE8, pero con return false, no he tenido, por eso le di una solucion generica y sencilla, con los datos que paso.

Siempre es bueno aprender cosas nuevas!

Saludos,

[pzin]

Yo creo que la solución más bien sería no usar enlaces si estos no van a tener enlaces, porque un enlace sin enlace como que no tiene mucho sentido.

Puedes usar cualquier otro elemento, e imitarlo como si fuese un enlace. Hasta cambiarle el estilo del cursor:

Código CSS:

span.mi_enlace_falso:hover {
  cursor: pointer;
}
 

Como digo, no tiene sentido un enlace que no enlaza.

[rogeliomx]

Gracias a todos de inmediato empiezo a probar las respuestas.