jQuery: Link changer lorsqu'un modificateur maintenu enfoncé - mais le lien cesse de fonctionner

Question

Je suis en train de créer un lien qui pointe vers l'URL 1 normalement et à l'URL 2 quand a lieu la touche Maj enfoncée. Je suis arrivé à cet exemple de code, qui commute correctement les liens (comme indiqué dans l'état navigateur barre lors du survol du lien), mais en cliquant sur l'URL 2 ne fonctionne pas: le navigateur ne fonctionne tout simplement pas faire quoi que ce soit. C'est vrai:. Un lien est présent, mais cliquant dessus juste ne rien

J'ai essayé ce dans Firefox 3.6.6 et Safari 5.0, même résultat dans les deux.

Les conseils? Merci!

<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

Semble le navigateur a un peu trop occupé à jour les DOM tandis que la touche Maj enfoncée a été pressé, donc je mets un drapeau en place:

<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>

Le seul problème est maintenant que - Comme l'a souligné Romain Deveaud -. SHIFT + clic ouvre une nouvelle fenêtre du navigateur

Answer 2

On dirait que parce que la touche Maj est sur le Dom pense que le « navigateur » traitera une demande spéciale. de sorte que lorsque la commande est envoyée au DOM Pour l'ouvrir échoue.

J'ai fait un petit test et viens avec cela.

<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>

Et cela semble fonctionner dans Google Chrome, mais est assez hacky.