jQuery: Enlace a cambiar cuando se mantiene pulsado el modificador - pero enlace deja de funcionar

Question

Estoy intentando crear un enlace que apunta al URL normalmente y 1 a 2 URL cuando la tecla de mayúsculas se mantiene presionado. Llegué a este ejemplo de código, que cambia adecuadamente los enlaces (como se indica en la barra de estado del navegador cuando se cierne sobre el enlace), pero al hacer clic en el URL 2 no funciona: el navegador simplemente no hace nada. Así es:. Un enlace está presente, pero al hacer clic simplemente no hace nada

probado este en Firefox 3.6.6 y Safari 5.0, mismo resultado en ambos.

¿Alguna pista? Gracias!

<script type="text/javascript" src="http://jqueryjs.googlecode.com/files/jquery-1.3.2.min.js"></script>
<script>
$(document).keydown(function(event) {
  if (event.keyCode == '16') {
    $("#mylink").text("My Link Extended");
    $("#mylink").attr("href", "http://www.google.com/");
  }
});
$(document).keyup(function(event) {
  if (event.keyCode == '16') {
    $("#mylink").text("My Link");
    $("#mylink").attr("href", "bla");
  }
});
</script>
<a href="normalurl" id="mylink">My Link</a>

Answer 1

Parece que el navegador tiene un poco demasiado ocupado actualización el DOM mientras se pulsa la tecla de mayúsculas, por lo que poner una bandera en su lugar:

<script type="text/javascript">
  $(document).ready(function() {
    var ExtendedLinkShown=false;

    $(document).keydown(function(event) {
      if (!ExtendedLinkShown && event.keyCode == '16') {
        $("#mylink").text("My Link Extended");
        $("#mylink").attr("href", "http://www.google.com/");
        ExtendedLinkShown=true;
      }
    });
    $(document).keyup(function(event) {
      if (event.keyCode == '16') {
        $("#mylink").text("My Link");
        $("#mylink").attr("href", "bla");
        ExtendedLinkShown=false;
      }
    });
  });
</script>

El único problema ahora es que - como ha señalado Romain Deveaud -. SHIFT + Click abre una nueva ventana del navegador

Answer 2

Parece que debido a que la tecla de mayúsculas se mantiene pulsado el Dom piensa que el "navegador" manejará una solicitud especial. de manera que cuando el comando se envía a la DOM Para abrir falla.

he hecho una pequeña prueba y llegar a esto.

<script type="text/javascript" src="http://jqueryjs.googlecode.com/files/jquery-1.3.2.min.js"></script>
<script>
$(document).keydown(function(event) {
  if (event.keyCode == '16') {
      event.keyCode = null; //Remove that
    $("#mylink").text("My Link Extended");
    $("#mylink").attr("href", "http://www.google.com/");
      event.keyCode = '16'; //Add it back
  }
});
$(document).keyup(function(event) {
  if (event.keyCode == '16') {
    event.keyCode = null; //Remove that
    $("#mylink").text("My Link");
    $("#mylink").attr("href", "bla");
    event.keyCode = '16'; //Add it back
  }
});
</script>
<a href="normalurl" id="mylink">My Link</a>

Y esto parece que funciona en Google Chrome, pero es bastante hacky.