2011-10-24 14 views
5

Me gustaría hacer un menú de navegación de fundido de color usando jQuery, en el que el botón "presionado" correspondiente a la página actual se comporta de manera diferente al botón "no presionado" (específicamente, no lo hace t se desvanece a un color diferente al pasar el mouse por encima). Si miro el ejemplo en www.guitaracademy.nl, veo que usan Javascript nativo con la propiedad window.location.hash.Uso de window.location.hash en jQuery

Sin embargo, parece que no puedo obtener este hash en jQuery. Aquí hay una secuencia de comandos de ejemplo:

<html> 
<head> 
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script> 
<script type="text/javascript"> 
$(function(){ 
    var p=window.location.hash; 
    $("#clickme").click(function(){ 
     alert(p) 
    }); 
}); 
</script> 
</head> 
<body> 
<a href="#test">Click me first</a> 
<div id="clickme">Then click me</div> 
</body> 
</html> 

Después de cargar esta página, hago clic en el enlace "Haga clic en mí primero"; luego en la barra de direcciones veo "#test" anexado a la URL original. Sin embargo, si a continuación, hago clic en el div "Haga clic en mí", veo una alerta vacía. Parece que el hash no está "actualizando".

Agradecería mucho cualquier ayuda al respecto.

Respuesta

5

Intenta mover la llamada para el hash dentro de la función para que se llame cada vez que se haga clic. De la forma en que lo tenías, solo se cargaba en la carga inicial de la página.

$(function(){ 
    $("#clickme").click(function(){ 
     var p=window.location.hash; 
     alert(p) 
    }); 
}); 
+0

Hola, sí, funcionó, gracias a todos por sus respuestas (convergentes)! –

0

Su función para el div #clickme nunca intenta actualizar el hash. Si estabas esperando su código para actualizar el hash que tendrá que manipularla como:

$("#clickme").click(function(){ 
    window.location.hash='#secondclick'; 

    //Remaining Code 
}); 
1

Trate de poner var p=window.location.hash; dentro de su clic-oyente:

<script type="text/javascript"> 
    $(function(){ 
     $("#clickme").click(function(){ 
      var p=window.location.hash; 
      alert(p) 
     }); 
    }); 
</script> 
0

El hash es conseguir upadated pero en este caso, la variable 'p' no se actualiza.

Aquí la instrucción de asignación

var p=window.location.hash; 

se ejecuta sólo una vez cuando se carga la página. Entonces, en el momento de cargar el valor de P está vacío, y siempre estará vacío.

En lugar de

alert(p) 

tratar

alert(window.location.hash) 

o mover la asignación dentro del clic de devolución de llamada. es decir, justo por encima de la declaración de alerta

Cuestiones relacionadas