2010-05-22 21 views
7

¿Cuál es la mejor manera de crossbrowser de hacer ancla sin href (javascript-driven) comportarse como un ancla real? La más obvia es utilizar # como ancla pero hace salto de página ...Anchor without href

+3

¿Te comportas como un ancla en qué sentido? Tener el cursor y subrayado al pasar el mouse? Si es así, sería mejor hacer cosas a través de CSS. – R0MANARMY

Respuesta

17

Un enlace que no hace nada, eso ni siquiera salto:

<a href="javascript:void(0)">link</a> 

Actualización: Como documento vinculado sugiere (señalado por la ambrosía), ya que los rendimientos void(0)undefined, es mejor escribir en realidad por encima de código como:

<a href="javascript:undefined">link</a> 

a menos que, por supuesto, ha sido redefinido indefinido.

+1

Este no es el propósito del método de vacío. [Fuente] (https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Operators/void) – SimonDever

5

Estos no saltarán:

​<a href="#null">Click</a> 
​<a href="#n">Click</a> 
<a href="#undefined">Click</a>​ 

Son, sin embargo, destruyendo el alma y muy feo.

+8

+1 para "destruir el alma" –

3

Si está reaccionando al evento click, simplemente asegúrese de devolver false y lo que esté en el href, ya sea un #hash u otro url, será ignorado.

<a href="#anything" onclick="doSomething(); return false;">link</a> 
1

Tal vez esto está bien también:

<a href="javascript:;">link</a> 
6

Debe return false desde el controlador de clic asociado al anclaje. Dado el HTML:

<a id="example" href="/whatever"/> 

la JS debe verse como:

document.getElementById('example').onclick = customAnchorReturn; 
function customAnchorReturn() { 
    // do stuff 
    return false; 
} 

o el uso de jQuery:

$('a#example').click(function(){ 
    // do stuff 
    return false; 
}); 

De esta manera, el JS será discreta y en caso JS está desactivado el ancla seguirá funcionando.