¿Cómo puedo crear un anclaje HTML vacío para que la página no "salte" cuando hago clic en él?

Question

Estoy trabajando en algunos JQuery para ocultar/mostrar algo de contenido cuando hago clic en un enlace. Puedo crear algo como:

<a href="#" onclick="jquery_stuff" /> 

Pero si hago clic en ese enlace mientras estoy desplacé hacia abajo en una página, que vuelva a saltar a la parte superior de la página.

Si hago algo como:

<a href="" onclick="jquery_stuff" /> 

La página se recargará, que deshace la página de todos los cambios que ha hecho Javascript.

Algo como esto:

<a onclick="jquery_stuff" /> 

me dará el efecto deseado, pero ya no se muestra como un enlace. ¿Hay alguna forma de especificar un anclaje vacío para poder asignar un controlador de JavaScript al evento onclick, sin cambiar nada en la página o mover la barra de desplazamiento?

Answer 1

Poner "return false;" en la segunda opción:

<a href="" onclick="jquery_stuff; return false;" /> 

Answer 2

<a href="javascript:// some helpful comment " onclick="jquery_stuff" /> 

Answer 3

Es necesario return false; después de la jquery_stuff:

<a href="no-javascript.html" onclick="jquery_stuff(); return false;" /> 

Esto cancelará la acción predeterminada.

Answer 4

<a href="javascript:;" onclick="jquery">link</a> 

href requiere algo allí si quieres que no pop-up errores en los validadores de HTML. El javascript:; es un buen lugar.

Si realmente desea utilizar el #:

<a href="#me" name="me" onclick="jquery">link</a> 

tener cuidado con el return false;, detiene el funcionamiento predeterminado de lo que está haciendo.

Además, si su js es como un envío, puede tener problemas con Internet Explorer.

Answer 5

Usted puede poner simplemente como, como a continuación:

<a href="javascript:;" onclick="jquery_stuff"> 

Answer 6

normalmente utilizo un estilo <span> y que se vea como un enlace cuando necesito para lograr algo como esto.

Answer 7

Por lo general hago: comentario

<a style="cursor:pointer;" onclick="whatever();">Whatever</a> 

Answer 8

Comprobar eyelidlessness' (utilizar un botón, no un ancla). Estaba a punto de publicar el mismo consejo. Un ancla que no se vincula a un recurso y simplemente ejecuta un script debe implementarse como un botón.

Deje de poner sus controladores de eventos en HTML, y deje de usar las etiquetas de ancla que no sirven para fines semánticos de anclaje. Use un botón y agregue el controlador de clic en su Javascript.Ejemplo: HTML <button id="jquery_stuff">Label</button> y JavaScript $('#jquery_stuff').click(jquery_stuff);. Puede usar CSS para marcar el estilo del botón para que parezca un enlace, eliminando el relleno, bordes, margen y color de fondo, luego agregue los estilos de vínculo (por ejemplo, color y texto-decoración). - eyelidlessness 19 de Oct '10 a las 17:40

Answer 9

¿Qué tal esto:

<a href="#nogo" onclick="foo();">some text</a> 

Answer 10

jQuery tiene una función incorporada en esta llamada preventDefault que se puede encontrar aquí: http://api.jquery.com/event.preventDefault/

Aquí su ejemplo:

<script> 
$("a").click(function(event) { 
    event.preventDefault(); 
}); 
</script> 

También puede construir el li nk así:

<a href="javascript:void(0)" onclick="myJsFunc();">Link</a> 

Answer 11

<a href="#" class="falseLinks">Link1</a> 
    <a href="#" class="falseLinks">Link2</a> 

etc ..

JQUERY:

$(function() { 
    $("a.falseLinks").click(function() { 
     // ...other stuff you want to do when links is clicked 

     // This is the same as putting onclick="return false;" in HTML 
    return false; 
    }) 
    }); 

@eyelidlessness era un poco douchy en la forma en que lo dijo, pero él tenía razón. Esta es la forma más limpia de hacerlo. ¿Por qué utilizar jQuery si luego vas a volver a Javascript vainilla para cosas jQuery es más fácil y más limpio?