73 votes

javascript capture navigateur raccourcis (ctrl+t/n/w)

Est-il possible de capturer ces raccourcis?

  • Ctrl+N
  • Ctrl+T
  • Ctrl+W

J'ai essayé ceci mais pas les œuvres:

$(window).keydown(function(event) {
  console.log(event.keyCode);
  event.preventDefault();
});

Lorsque j'appuie T il montre 84 dans la console, mais si j'appuie sur Ctrl+T , il ne montre rien, mais ouvre un nouvel onglet.

Je voudrais saisir ces raccourcis et de prévenir n'importe quel navigateur d'action.

114voto

Gergely Fehérvári Points 3247

La capture de la touche Ctrl du clavier événements en Javascript

Exemple de code:

$(window).keydown(function(event) {
  if(event.ctrlKey && event.keyCode == 84) { 
    console.log("Hey! Ctrl+T event captured!");
    event.preventDefault(); 
  }
  if(event.ctrlKey && event.keyCode == 83) { 
    console.log("Hey! Ctrl+S event captured!");
    event.preventDefault(); 
  }
});

Firefox

(6.0.1 testé)

Dans Firefox, les deux écouteur d'événement œuvres. Si vous appuyez sur CtrlT ou CtrlS keycombinations, vous recevrez le message sur la console, et le navigateur l'habitude d'ouvrir un onglet, ni demander de l'enregistrer.

Il est intéressant que si vous utilisez alert au lieu de console.log le event.preventDefault() fonctionne pas, et ouvre un nouvel onglet ou une demande pour enregistrer. Peut-être que ce bug doit se fixe.


Chrome3

Dans Chrome 3, il fonctionne comme dans Firefox.


Chrome4

(testé)

Dans Chrome4, un certain contrôle des combinaisons de touches ont été réservés pour le navigateur l'utilisation de la seule et ne peut plus être intercepté par le côté client JavaScript dans la page web.
Ces restrictions n'existent pas dans Chrome3 et sont incompatibles avec Firefox3/3.5 et IE7/8 (sur Windows).

Dans Chrome 4, il fonctionne de même pour Firefox, à l'exception de certaines combinaison de clavier:

  • CtrlN

  • CtrlMajN

  • CtrlT

  • CtrlShiftT

  • CtrlW

  • CtrlShiftW

Ces combinaisons ne peuvent pas obtenir capturé par du Javascript, mais intégrer des plugins peuvent saisir ces. Par exemple, si vous vous concentrez dans une vidéo Youtube et appuyez sur CtrlT, le navigateur n'est pas ouvert un nouvel onglet.


IE7/8

Il fonctionne comme dans Firefox ou Chrome3.


IE9

(testé)

IE9 est un mouton noir à nouveau, car il ne marche pas autoriser le javascript pour la capture de toute Ctrl? l'événement de clavier. J'ai testé avec de nombreuses combinaisons de touches (R,T,P,S,N,T) et ni travaillé. Également intégrer les applications ne peuvent pas capturer l'événement. Testé avec les vidéos de Youtube.


Merci à @Chaux pour le grand lien.

11voto

JotaBe Points 8950

A compter de Mars 20th, 2012, il y a eu un fix Chrome qui permet aux applications web de la poignée de Contrôle+territoires du nord ouest, Chrome en js événement keydown (de sorte qu'il fonctionne en javascript, ou des bibliothèques comme jQuery).

Ce correctif permet à javascript pour gérer cette combinaisons de touches si Chrome est ouvert dans le mode d'Application, ce qui peut être fait de cette façon:

Le correctif qui est décrite ici:

2voto

Robin Millette Points 11

Au lieu de piégeage de la combinaison de touches CTRL-W touche de raccourci, de détecter lorsque la fenêtre est fermée pourrait être une option valable:

"La beforeunload événement est déclenché lorsque la fenêtre, le document et ses ressources sont sur le point d'être déchargées.

Quand une chaîne non vide est affecté à la propriété returnValue propriété d'Événement, une boîte de dialogue apparaît, demandant aux utilisateurs de confirmation pour quitter la page (voir l'exemple ci-dessous). Si aucune valeur n'est fournie, l'événement est traité en silence."

1voto

Robin Points 1820

La réponse est très simple: Ce n'est pas possible directement, sans quelques astuces en javascript.

Il dépend du navigateur. La plupart du temps tout navigateur attraper ce raccourcis et les utiliser pour leurs propres événements. (e.g d'ouvrir de nouveaux onglets) Le raccourci ne jamais atteindre le moteur javascript.

Ce qui est facile possible, cependant, pour attraper les raccourcis avec flash. Mais c'est à l'échelle de distance à partir d'un site web convivial.

Mise à jour:

Voici un court exemple. La plupart du temps tout navigateur affiche l'alerte lorsque Ctrl+y est enfoncé. (y = 89)

document.onkeydown = keyDownEvent;
document.onkeyup = keyUpEvent;

var isCtrl = false;

function keyDownEvent() {
    var keyid = event.keyCode;

    if(keyid == 17) {
        isCtrl = true;
    }
}

function keyUpEvent() {
    var keyid = event.keyCode;

    if(keyid == 17) {
        isCtrl = false;
    }

    if(keyid == 89 && isCtrl == true) {
        alert('CTRL-Y pressed');   
    }
}

Si vous remplacez le 84 89, ce qui représente une t, rien ne se passera. Vous pouvez l'essayer sur jsfiddle.net.

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X