diff options
| author | Peter Bengtsson <mail@peterbe.com> | 2020-12-08 14:40:17 -0500 |
|---|---|---|
| committer | Peter Bengtsson <mail@peterbe.com> | 2020-12-08 14:40:17 -0500 |
| commit | 33058f2b292b3a581333bdfb21b8f671898c5060 (patch) | |
| tree | 51c3e392513ec574331b2d3f85c394445ea803c6 /files/fr/web/api/keyboardevent | |
| parent | 8b66d724f7caf0157093fb09cfec8fbd0c6ad50a (diff) | |
| download | translated-content-33058f2b292b3a581333bdfb21b8f671898c5060.tar.gz translated-content-33058f2b292b3a581333bdfb21b8f671898c5060.tar.bz2 translated-content-33058f2b292b3a581333bdfb21b8f671898c5060.zip | |
initial commit
Diffstat (limited to 'files/fr/web/api/keyboardevent')
| -rw-r--r-- | files/fr/web/api/keyboardevent/charcode/index.html | 102 | ||||
| -rw-r--r-- | files/fr/web/api/keyboardevent/code/index.html | 217 | ||||
| -rw-r--r-- | files/fr/web/api/keyboardevent/index.html | 244 | ||||
| -rw-r--r-- | files/fr/web/api/keyboardevent/key/index.html | 227 | ||||
| -rw-r--r-- | files/fr/web/api/keyboardevent/key/key_values/index.html | 3639 | ||||
| -rw-r--r-- | files/fr/web/api/keyboardevent/keyboardevent/index.html | 86 |
6 files changed, 4515 insertions, 0 deletions
diff --git a/files/fr/web/api/keyboardevent/charcode/index.html b/files/fr/web/api/keyboardevent/charcode/index.html new file mode 100644 index 0000000000..34335deca5 --- /dev/null +++ b/files/fr/web/api/keyboardevent/charcode/index.html @@ -0,0 +1,102 @@ +--- +title: KeyboardEvent.charCode +slug: Web/API/KeyboardEvent/charCode +tags: + - API + - Clavier + - DOM + - Déprécié + - Propriété + - Référence(2) + - évènements +translation_of: Web/API/KeyboardEvent/charCode +--- +<p>{{ ApiRef("DOM Events") }}{{non-standard_header}}{{deprecated_header}}</p> + +<p>La propriété en lecture seule {{domxref("KeyboardEvent.charCode")}} retourne la valeur Unicode d'une touche caractère pressée pendant un évènement {{ domxref("element.onkeypress", "keypress") }}.</p> + +<p>Pour des constantes équivalant ces codes numériques, voir {{ domxref("KeyboardEvent", "KeyEvent") }}.</p> + +<div class="note"> +<p><strong><code>N'utilisez plus cette propriété, elle est dépréciée.</code></strong></p> + +<p>Utilisez plutôt {{domxref("KeyboardEvent.key")}}.</p> +</div> + +<h2 id="Syntax" name="Syntax">Syntaxe</h2> + +<pre class="syntaxbox"><em>var value</em> = <em>event</em>.charCode; +</pre> + +<ul> + <li><em><code>value</code></em> est la valeur Unicode du caractère associé à la touche pressée.</li> +</ul> + +<h2 id="Example" name="Example">Exemple</h2> + +<pre class="brush: js"><html> + <head> + <title>Exemple charCode</title> + + <script type="text/javascript"> + + function AfficherCaractere(e) + { + alert( + "Touche tapée : " + + String.fromCharCode(e.charCode) + "\n" + + "charCode: " + e.charCode + ); + } + + </script> + </head> + + <body onkeypress="AfficherCaractere(event);"> + <p>Tapez une touche caractère de votre clavier (a,b,c...)</p> + </body> +</html> +</pre> + +<h2 id="Notes" name="Notes">Notes</h2> + +<p>Après un évènement {{ domxref("element.onkeypress", "keypress") }}, la valeur Unicode de la touche pressée est stockée dans l'une ou l'autre des propriétés <code>{{ domxref("event.keyCode", "keyCode") }}</code> et <code>charCode</code>, jamais les deux à la fois. Si la touche pressée génère un caractère (ex. 'a'), <code>charCode</code> prend la valeur du code de ce caractère, en respectant la casse. (i.e. <code>charCode</code> tient compte d'une touche Maj. enfoncée). Sinon, le code est stocké dans <code>keyCode</code>.</p> + +<p>Quand une ou plusieurs touche modificatrices sont pressées, il y a quelques règles complexes pour <code>charCode</code>, jetez un oeil à <a href="/en/Gecko_Keypress_Event" title="en/Gecko Keypress Event">Gecko Keypress Event</a> (en anglais) pour le détail.</p> + +<p><code>charCode</code> n'est jamais défini lors d'évènements {{ domxref("element.onkeydown", "keydown") }} et {{ domxref("element.onkeyup", "keyup") }}. Dans ces cas, <code>keyCode</code> is set instead.</p> + +<p>Pour obtenir le code de la touche qu'il soit stocké dans <code>keyCode</code> ou <code>charCode</code>, requêtez la propriété {{ domxref("event.which", "which") }}.</p> + +<p>Les caractères entrés via IME ne s'enregistrent pas sous <code>keyCode</code> ou <code>charCode</code>. <span class="comment">Actually with the Chinese IME I'm using, entering the IME results in a keypress event with keyCode = 229 and no other key events fire until the IME exits (which may happen after multiple characters are inputted). I'm not sure if other IME's work this way.</span></p> + +<p>Pour une liste de valeurs de <code>charCode</code> associées à leurs touches, lancez l'exemple dans <a href="/en/Gecko_DOM_Reference/Examples#Example_7:_Displaying_Event_Object_Constants" title="en/Gecko_DOM_Reference/Examples#Example_7:_Displaying_Event_Object_Constants">Gecko DOM Reference:Examples #Example 7: Displaying Event Object Constants</a> (en anglais) et regardez le tableau HTML résultant.</p> + +<h2 id="Specifications" name="Specifications">Spécifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Spécification (en anglais)</th> + <th scope="col">Statut</th> + <th scope="col">Commentaire</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('DOM3 Events','#widl-KeyboardEvent-charCode','KeyboardEvent.charCode')}}</td> + <td>{{Spec2('DOM3 Events')}}</td> + <td>Définition initiale; Déprécié</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + + + +<p>{{Compat("api.KeyboardEvent.charCode")}}</p> + +<div id="compat-desktop"></div> + +<div id="compat-mobile"></div> diff --git a/files/fr/web/api/keyboardevent/code/index.html b/files/fr/web/api/keyboardevent/code/index.html new file mode 100644 index 0000000000..dee3e236e0 --- /dev/null +++ b/files/fr/web/api/keyboardevent/code/index.html @@ -0,0 +1,217 @@ +--- +title: KeyboardEvent.code +slug: Web/API/KeyboardEvent/code +tags: + - API + - Code + - DOM Events + - KeyboardEvent + - Propriété + - Reference +translation_of: Web/API/KeyboardEvent/code +--- +<div>{{APIRef("DOM Events")}}</div> + +<p><span class="seoSummary">La propriété <strong><code>KeyboardEvent.code</code></strong> représente une touche physique du clavier (contrairement au caractère généré par celle-ci). En d'autres termes, cette propriété retourne une valeur qui n'est pas modifiée par la disposition du clavier ou l'état des touches de modification.</span></p> + +<p>Si le clavier n'est pas physique, la valeur retournée sera définie par le navigateur pour être le plus proche possible des valeurs retournées par un clavier physique afin de maximiser la compatibilité entre un clavier physique et virtuel.</p> + +<p>Cette propriété est utile quand vous souhaitez manipuler les clés en fonction de leur position physique sur le clavier et non les caractères associés au clés (par exemple pour les touches de déplacement d'un jeu vidéo). Attention toutefois, on ne pourra pas utiliser la valeur fournie par <code>KeyboardEvent.code</code> afin de déterminer le caractère utilisé sur le clavier.</p> + +<p>Par exemple, le <code>code</code> retourné est <code>"KeyQ"</code> pour le caractère "<kbd>q</kbd>" sur un clavier QWERTY, mais le même <code>code</code> représente le caractère "<kbd>'</kbd>" sur un clavier Dvorak, et le caractère "<kbd>a</kbd>" sur un clavier AZERTY. Cela rend impossible l'utilisation du <code>code</code> pour déterminer le code d'une clé destiné aux utilisateurs s'ils n'utilisent pas une disposition de clavier anticipé.</p> + +<p>Pour déterminer quel caractère correspond à un <code>key event</code>, utilisez plutôt la propriété {{domxref("KeyboardEvent.key")}}.</p> + +<h2 id="Valeurs_des_codes">Valeurs des codes</h2> + +<p>Les valeurs de code pour Windows, Linux et macOS figurent dans la liste de la <a href="/fr/docs/Web/API/KeyboardEvent/code/code_values">KeyboardEvent: code values</a>.</p> + +<h2 id="Exemples">Exemples</h2> + +<h3 id="Pratiquer_KeyboardEvent">Pratiquer <code>KeyboardEvent</code></h3> + +<h4 id="HTML">HTML</h4> + +<pre class="brush: html"><p> + Appuyez sur une touche du clavier pour voir quelle valeur clé de + KeyboardEvent correspond à chaque événement +</p> +<div id="output"> +</div> +</pre> + +<h4 id="CSS">CSS</h4> + +<pre class="brush: css">#output { + font-family: Arial, Helvetica, sans-serif; + border: 1px solid black; +}</pre> + +<h4 id="JavaScript">JavaScript</h4> + +<pre class="brush: js">window.addEventListener("keydown", function(event) { + let str = "KeyboardEvent: key='" + event.key + "' | code='" + + event.code + "'"; + let el = document.createElement("span"); + el.innerHTML = str + "<br/>"; + + document.getElementById("output").appendChild(el); +}, true);</pre> + +<h4 id="Résultat">Résultat</h4> + +<p>Pour essayer ce code, cliquez sur le lien ci-dessous:</p> + +<p>{{EmbedLiveSample('Pratiquer_KeyboardEvent', 600, 300) }}</p> + +<h3 id="Gérer_les_événements_de_clavier_dans_un_jeu"><span class="tlid-translation translation" lang="fr"><span title="">Gérer les événements de clavier dans un jeu</span></span></h3> + +<div class="text-wrap tlid-copy-target"> +<div class="result-shield-container tlid-copy-target"><span class="tlid-translation translation" lang="fr"><span title="">Cet exemple établit un écouteur d'événements pour</span></span> l'événement {{event("keydown")}} <span class="tlid-translation translation" lang="fr"><span title="">qui gère la saisie au clavier pour un jeu qui utilise la disposition de clavier typique "ZQSD" pour se déplacer en avant, à gauche, en arrière et à droite.</span> <span title="">Cela utilisera les quatre mêmes touches physiquement, quels que soient les caractères correspondants, par exemple si l'utilisateur utilise un clavier QWERTY.</span></span></div> +</div> + +<h4 id="HTML_2">HTML</h4> + +<pre class="brush: html"><p>Appuyez sur les touches ZQSD (WASP sur QWERTY) pour bouger et pour vous diriger</p> +<svg xmlns="http://www.w3.org/2000/svg" version="1.1" class="world"> + <polygon id="spaceship" points="15,0 0,30 30,30"/> +</svg> +<script>refresh();</script> +</pre> + +<h4 id="CSS_2">CSS</h4> + +<pre class="brush: css">.world { + margin: 0px; + padding: 0px; + background-color: black; + width: 400px; + height: 400px; +} + +#spaceship { + fill: orange; + stroke: red; + stroke-width: 2px; +}</pre> + +<h4 id="JavaScript_2">JavaScript</h4> + +<p>La première section du code JavaScript établit certaines variables que nous allons utiliser. <code>shipSize</code> contient la taille du vaisseau dans lequel le joueur se déplace, pour plus de commodité. <code>position</code> est utilisé pour suivre la position du vaisseau sur le terrain de jeu. <code>moveRate</code> et <code>turnRate</code> sont le nombre de pixels en avant et en arrière chaque fois que vous appuyez sur une touche pour déplacer le vaisseau et le nombre de degrés de rotation que les commandes de direction gauche et droite appliquent à chaque frappe. <code>angle</code> est la quantité actuelle de rotation appliquée au vaisseau, en degrés; il commence à 0 ° (pointant tout droit). Enfin, <code>spaceship</code> est défini pour faire référence à l'élément portant l'ID "spaceship", qui est le polygone SVG représentant le vaisseau que le joueur contrôle.</p> + +<pre class="brush: js">let shipSize = { + width: 30, + height: 30 +}; + +let position = { + x: 200, + y: 200 +}; + +let moveRate = 9; +let turnRate = 5; + +let angle = 0; + +let spaceship = document.getElementById("spaceship"); +</pre> + +<p>Vient ensuite la fonction <code>updatePosition()</code>. Cette fonction prend en entrée la distance à laquelle le vaisseau doit être déplacé, où positif est un mouvement en avant et négatif est un mouvement en arrière. Cette fonction calcule la nouvelle position du vaisseau en fonction de la distance parcourue et de la direction actuelle du vaisseau. Il veille également à ce que le vaisseau franchisse les limites du terrain de jeu au lieu de disparaître.</p> + +<pre class="brush: js">function updatePosition(offset) { + let rad = angle * (Math.PI/180); + position.x += (Math.sin(rad) * offset); + position.y -= (Math.cos(rad) * offset); + + if (position.x < 0) { + position.x = 399; + } else if (position.x > 399) { + position.x = 0; + } + + if (position.y < 0) { + position.y = 399; + } else if (position.y > 399) { + position.y = 0; + } +} +</pre> + +<p>La fonction <code>refresh()</code> <span class="tlid-translation translation" lang="fr"><span title="">gère l'application de la rotation et de la position à l'aide d'un</span></span> <a href="/en-US/docs/Web/SVG/Attribute/transform">SVG transform</a>.</p> + +<pre class="brush: js">function refresh() { + let x = position.x - (shipSize.width/2); + let y = position.y - (shipSize.height/2); + let transform = "translate(" + x + " " + y + ") rotate(" + angle + " 15 15) "; + + spaceship.setAttribute("transform", transform); +} +</pre> + +<p><span class="tlid-translation translation" lang="fr"><span title="">Enfin, la méthode <code>addEventListener()</code> est utilisée pour commencer à écouter les événements {{event ("keydown")}}, en mettant à jour chaque touche en mettant à jour la position et l’angle de rotation du vaisseau, puis en appelant la méthode <code>refresh()</code> pour tracer le navire dans sa nouvelle position </span><span title="">et son nouvel angle.</span></span></p> + +<pre class="brush: js">window.addEventListener("keydown", function(event) { + if (event.preventDefaulted) { + return; // Do nothing if event already handled + } + + switch(event.code) { + case "KeyS": + case "ArrowDown": + // Handle "back" + updatePosition(-moveRate); + break; + case "KeyW": + case "ArrowUp": + // Handle "forward" + updatePosition(moveRate); + break; + case "KeyA": + case "ArrowLeft": + // Handle "turn left" + angle -= turnRate; + break; + case "KeyD": + case "ArrowRight": + // Handle "turn right" + angle += turnRate; + break; + } + + refresh(); + + // Consume the event so it doesn't get handled twice + event.preventDefault(); +}, true);</pre> + +<h4 id="Résultat_2">Résultat</h4> + +<p>Pour essayer le code ci-dessus, cliquez sur le bouton ci-dessous:</p> + +<p>{{EmbedLiveSample("Handle_keyboard_events_in_a_game", 420, 460)}}</p> + +<p><span class="tlid-translation translation" lang="fr"><span title="">Ce code peut être amélioré de plusieurs manières.</span> <span title="">La plupart des jeux réels surveillent les événements</span></span> {{event("keydown")}}, <span class="tlid-translation translation" lang="fr"><span title="">démarrent le mouvement lorsque cela se produit et stoppent le mouvement lorsque l'événement</span></span> {{event("keyup")}} se produit, au lieu de compter sur des répétitions de touches. <span class="tlid-translation translation" lang="fr"><span title="">Cela permettrait des mouvements plus fluides et plus rapides, mais permettrait également au joueur de bouger et de diriger en même temps.</span> <span title="">Des transitions ou des animations peuvent également être utilisées pour rendre le mouvement du navire plus fluide.</span></span> Pour permettre cela, il ne faudrait pas utiliser de <code>switch</code>, ni de <code>else if</code>.ff</p> + +<h2 id="Spécifications">Spécifications</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Spécification</th> + <th scope="col">État</th> + <th scope="col">Commentaires</th> + </tr> + <tr> + <td>{{SpecName('UI Events', '#dom-keyboardevent-code', 'KeyboardEvent.code')}}</td> + <td>{{Spec2('UI Events')}}</td> + <td>Définition initiale, inclut les <a href="https://w3c.github.io/uievents-code/">valeurs de code</a>.</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<div class="hidden">Le tableau de compatibilité de cette page a été généré à partir de données structurées. Si vous souhaitez contribuer à ces données, n'hésitez pas à consulter <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> et à nous envoyer une <em>pull request</em>.</div> + +<p>{{Compat("api.KeyboardEvent.code")}}</p> diff --git a/files/fr/web/api/keyboardevent/index.html b/files/fr/web/api/keyboardevent/index.html new file mode 100644 index 0000000000..fe8ef03ea0 --- /dev/null +++ b/files/fr/web/api/keyboardevent/index.html @@ -0,0 +1,244 @@ +--- +title: KeyboardEvent +slug: Web/API/KeyboardEvent +tags: + - API + - DOM + - Evènements IU + - Interface + - Reference + - évènements +translation_of: Web/API/KeyboardEvent +--- +<div>{{APIRef("DOM Events")}}</div> + +<p>Les objets <strong><code>KeyboardEvent</code></strong> décrivent l'interaction d'un utilisateur avec le clavier. Chaque événement décrit une touche ; le type d'événement (<code>keydown</code>, <code>keypress</code>, ou <code>keyup</code>) identifie quel type d'activité a été effectué.</p> + +<div class="note"><strong>Note :</strong> <code>KeyboardEvent</code> indique exactement ce qui est en train de se passer sur une touche. Lorsque vous devez gérer une saisie de texte, utilisez l'événement <code>input</code> HTML5 à la place. Par exemple, si un utilisateur saisit du texte à partir d'un système d'écriture à la main comme une tablette PC, les événements touche peuvent ne pas être déclenchés.</div> + +<h2 id="Constructeur">Constructeur</h2> + +<dl> + <dt>{{domxref("KeyboardEvent.KeyboardEvent", "KeyboardEvent()")}}</dt> + <dd>Crée un objet <code>KeyboardEvent</code>.</dd> +</dl> + +<h2 id="Méthodes">Méthodes</h2> + +<p><em>Cette interface hérite également des méthodes de ses parents, {{domxref("UIEvent")}} et {{domxref("Event")}}.</em></p> + +<dl> + <dt>{{domxref("KeyboardEvent.getModifierState()")}}</dt> + <dd>Retourne un {{jsxref("Boolean")}} indiquant si une touche modifcatrice, telle que <kbd>Alt</kbd>, <kbd>Shift</kbd>, <kbd>Ctrl</kbd>, ou <kbd>Meta</kbd>, était pressée quand l'évènement a été créé.</dd> + <dt>{{domxref("KeyboardEvent.initKeyEvent()")}}{{deprecated_inline}}</dt> + <dd>Initialise un objet <code>KeyboardEvent</code>. Ceci a été implémenté seulement par Gecko (d'autres utilisaient {{domxref ("KeyboardEvent.initKeyboardEvent()")}}) et ne devrait plus être utilisé. La manière moderne standard consiste à utiliser le constructeur {{domxref ("KeyboardEvent.KeyboardEvent", "KeyboardEvent()")}}.</dd> + <dt>{{domxref("KeyboardEvent.initKeyboardEvent()")}}{{deprecated_inline}}</dt> + <dd>Initialise un objet <code>KeyboardEvent</code>. Cela n'a jamais été implémenté par Gecko (qui utilisait {{domxref ("KeyboardEvent.initKeyEvent()")}}) et ne devrait plus être utilisé. La manière moderne standard consiste à utiliser le constructeur {{domxref ("KeyboardEvent.KeyboardEvent", "KeyboardEvent()")}}.</dd> +</dl> + +<h2 id="Propriétés">Propriétés</h2> + +<p><em>Cette interface hérite également des propriétés de ses parents, {{domxref("UIEvent")}} et {{domxref("Event")}}.</em></p> + +<dl> + <dt>{{domxref("KeyboardEvent.altKey")}} {{Readonlyinline}}</dt> + <dd>Returne un {{jsxref("Boolean")}} qui est <code>true</code> si la touche <kbd>Alt</kbd> (<kbd>Option</kbd> ou <kbd>⌥</kbd> sous OS X) était active quand l'évènement touche a été généré.</dd> + <dt>{{domxref("KeyboardEvent.char")}} {{Non-standard_inline}}{{Deprecated_inline}}{{Readonlyinline}}</dt> + <dd>Renvoie une {{domxref("DOMString")}} représentant la valeur de caractère de la touche. Si la touche correspond à un caractère imprimable, cette valeur est une chaîne Unicode non vide contenant ce caractère. Si la touche n'a pas de représentation imprimable, il s'agit d'une chaîne vide.</dd> + <dd> + <div class="note"> + <p><strong>Note :</strong> si la touche est utilisée comme une macro insérant plusieurs caractères, la valeur de cet attribut est la chaîne entière, pas seulement le premier caractère.</p> + </div> + </dd> + <dd> + <div class="warning"> + <p><strong>Avertissement :</strong> cela a été supprimé des DOM Level 3 Events. C'est pris en charge uniquement sur IE9 + et Microsoft Edge.</p> + </div> + </dd> + <dt>{{domxref("KeyboardEvent.charCode")}} {{Deprecated_inline}}{{Readonlyinline}}</dt> + <dd>Retourne un {{jsxref ("Number")}} représentant le numéro de référence Unicode de la touche ; cet attribut est utilisé uniquement par l'événement <code>keypress</code>. Pour les touches dont l'attribut <code>char</code> contient plusieurs caractères, il s'agit de la valeur Unicode du premier caractère de cet attribut. Dans Firefox 26, cela retourne des codes pour les caractères imprimables.</dd> + <dd> + <div class="warning"> + <p><strong>Avertissement :</strong> cet attribut est obsolète : vous devriez utiliser {{domxref("KeyboardEvent.key")}} à la place, si disponible.</p> + </div> + </dd> + <dt>{{domxref("KeyboardEvent.code")}} {{Readonlyinline}}</dt> + <dd>Retourne une {{domxref ("DOMString")}} avec la valeur du code de la touche représentée par l'événement.</dd> + <dt>{{domxref("KeyboardEvent.ctrlKey")}} {{Readonlyinline}}</dt> + <dd>Retourne un {{jsxref ("Boolean")}} qui est <code>true</code> si la touche <kbd>Ctrl</kbd> était active lorsque l'événement touche a été généré.</dd> + <dt>{{domxref("KeyboardEvent.isComposing")}} {{Readonlyinline}}</dt> + <dd>Renvoie un {{jsxref ("Boolean")}} qui est <code>true</code> si l'événement est déclenché après <code>compositionstart</code> et avant <code>compositionend</code>.</dd> + <dt>{{domxref("KeyboardEvent.key")}} {{Readonlyinline}}</dt> + <dd>Retourne une {{domxref ("DOMString")}} représentant la valeur de touche de la touche représentée par l'événement.</dd> + <dt>{{domxref("KeyboardEvent.keyCode")}} {{deprecated_inline}}{{Readonlyinline}}</dt> + <dd>Retourne un {{jsxref("Number")}} représentant un code numérique dépendant du système et de l'implémentation, identifiant la valeur non modifiée de la touche pressée. + <div class="warning"><strong>Avertissement : </strong>cet attribut est obsolète. vous devriez utiliser {{domxref("KeyboardEvent.key")}} à la place, si disponible.</div> + </dd> + <dt>{{domxref("KeyboardEvent.keyIdentifier")}} {{Non-standard_inline}}{{deprecated_inline}}{{Readonlyinline}}</dt> + <dd>Cette propriété n'est pas standard et a été abandonnée en faveur de {{domxref("KeyboardEvent.key")}}. Elle faisait partie d'une ancienne version de DOM Level 3 Events.</dd> + <dt>{{domxref("KeyboardEvent.keyLocation")}} {{Non-standard_inline}}{{deprecated_inline}}{{Readonlyinline}}</dt> + <dd>C'est un alias obsolète non standard pour {{domxref("KeyboardEvent.location")}}. Il faisait partie d'une ancienne version de DOM Level 3 Events.</dd> + <dt>{{domxref("KeyboardEvent.locale")}} {{Readonlyinline}}</dt> + <dd>Retourne une {{domxref("DOMString")}} représentant une chaîne de paramètres régionaux indiquant les paramètres régionaux pour lesquels le clavier est configuré. Cela peut être une chaîne vide si le navigateur ou l'appareil ne connaît pas les paramètres régionaux du clavier. + <div class="note"><strong>Note :</strong> cela ne décrit pas les paramètres régionaux des données entrées. Un utilisateur peut utiliser une disposition du clavier donnée, tout en saisissant du texte dans une autre langue.</div> + </dd> + <dt>{{domxref("KeyboardEvent.location")}}<a> {{Readonlyinline}}</a></dt> + <dd>Retourne un {{jsxref ("Number")}} représentant l'emplacement de la touche du clavier ou tout autre dispositif d'entrée.</dd> + <dt>{{domxref("KeyboardEvent.metaKey")}} {{Readonlyinline}}</dt> + <dd>Retourne un {{jsxref("Boolean")}} qui est <code>true</code> si la touche <kbd>Meta</kbd> (sur les claviers Mac, la touche <kbd>⌘ Command</kbd> ; sur les claviers Windows, la touche Windows (<kbd>⊞</kbd>)) était active quand l'évènement touche a été généré.</dd> + <dt>{{domxref("KeyboardEvent.repeat")}} {{Readonlyinline}}</dt> + <dd>Retourne un {{jsxref("Booléen")}} qui est <code>true</code> si la touche est maintenue enfoncée de telle sorte qu'elle se répète automatiquement.</dd> + <dt>{{domxref("KeyboardEvent.shiftKey")}} {{Readonlyinline}}</dt> + <dd>Retourne un {{jsxref("Boolean")}} qui est <code>true</code> si la touche <kbd>Shift</kbd> était active quand l'évènement touche a été généré.</dd> + <dt>{{domxref("KeyboardEvent.which")}} {{deprecated_inline}}{{Readonlyinline}}</dt> + <dd>Retourne un {{jsxref("Number")}} représentant un code numérique dépendant du système et de l'implémentation, identifiant la valeur non modifiée de la touche pressée ; c'est généralement le même que <code>keyCode</code>. + <div class="warning"><strong>Avertissement :</strong> cet attribut est obsolète ; vous devriez utiliser {{domxref("KeyboardEvent.key")}} à la place, si disponible.</div> + </dd> +</dl> + +<h2 id="Notes">Notes</h2> + +<p>Les événements existants sont <code>keydown</code>, <code>keypress</code> et <code>keyup</code>. Pour la plupart des touches, Gecko génère une suite d'événements touche comme suit :</p> + +<ol> + <li>lorsque la touche est d'abord enfoncée, l'événement <code>keydown</code> est envoyé ;</li> + <li>si la touche n'est pas une touche de modification, l'événement <code>keypress</code> est envoyé ;</li> + <li>lorsque l'utilisateur relâche la touche, l'événement <code>keyup</code> est envoyé.</li> +</ol> + +<h3 id="Cas_particuliers">Cas particuliers</h3> + +<p>Certaines touches inversent l'état d'un voyant lumineux ; celles-ci comprennent des touches telles que Caps Lock, Num Lock et Scroll Lock. Sous Windows et Linux, ces touches génèrent uniquement les événements <code>keydown</code> et <code>keyup</code>.</p> + +<div class="note"> +<p>Sous Linux, Firefox 12 et les versions antérieures ont également envoyé l'événement <code>keypress</code> pour ces touches.</p> +</div> + +<p>Cependant, une limitation du modèle d'événement Mac OS X fait que Caps Lock ne génère que l'événement <code>keydown</code>. Num Lock était supporté sur certains modèles d'ordinateurs portables plus anciens (modèles 2007 et plus anciens), mais depuis lors, Mac OS X n'a pas supporté Num Lock même sur les claviers externes. Sur les MacBooks plus anciens avec une touche Num Lock, cette touche ne génère aucun événement touche. Gecko supporte la touche Scroll Lock si un clavier externe ayant une touche F14 est connecté. Dans certaines anciennes versions de Firefox, cette touche générait un événement <code>keypress</code> ; ce comportement incohérent était le {{bug(602812)}}.</p> + +<h3 id="Gestion_de_l'auto-répétition">Gestion de l'auto-répétition</h3> + +<p> </p> + +<p>Lorsqu'une touche est maintenue enfoncée, elle commence à se répéter automatiquement. Cela a pour résultat qu'une suite d'événements similaire à ce qui suit est générée :</p> + +<ol> + <li><code>keydown</code></li> + <li><code>keypress</code></li> + <li><code>keydown</code></li> + <li><code>keypress</code></li> + <li><< répétition jusqu'à ce que l'utilisateur relâche la touche >></li> + <li><code>keyup</code></li> +</ol> + +<p>C'est ce que la spécification DOM Niveau 3 dit qu'il devrait se produire. Cependant, il y a quelques mises en garde, comme décrit ci-dessous.</p> + +<p> </p> + +<h4 id="Auto-répétition_sur_certains_environnements_GTK_tels_que_Ubuntu_9.4">Auto-répétition sur certains environnements GTK tels que Ubuntu 9.4</h4> + +<p>Dans certains environnements basés sur GTK, l'auto-répétition génère automatiquement un événement natif lors de la répétition automatique, et Gecko n'a aucun moyen de connaître la différence entre une suite répétée de touches et une répétition automatique. Sur ces plateformes, une touche auto-répétée génère donc la suite d'événements suivante :</p> + +<ol> + <li><code>keydown</code></li> + <li><code>keypress</code></li> + <li><code>keyup</code></li> + <li><code>keydown</code></li> + <li><code>keypress</code></li> + <li><code>keyup</code></li> + <li><< répétition jusqu'à ce que l'utilisateur relâche la touche >></li> + <li><code>keyup</code></li> +</ol> + +<p>Dans ces environnements, malheureusement, il n'y a aucun moyen pour que le contenu Web puisse faire la différence entre les touches répétées automatiquement et les touches qui sont simplement pressées à plusieurs reprises.</p> + +<h4 id="Gestion_de_l'auto-répétition_avant_Gecko_5.0">Gestion de l'auto-répétition avant Gecko 5.0</h4> + +<p>Avant Gecko 5.0 {{geckoRelease('5.0')}}, la gestion du clavier était moins cohérente entre les plates-formes.</p> + +<dl> + <dt>Windows</dt> + <dd>Le comportement de la répétition automatique est le même que dans Gecko 4.0 et ultérieur.</dd> + <dt>Mac</dt> + <dd>Après l'événement keydown initial, seuls les événements keypress sont envoyés jusqu'à ce que l'événement keyup se produise ; les événements de clavier intermédiaires ne sont pas envoyés.</dd> + <dt>Linux</dt> + <dd>Le comportement de l'événement dépend de la plate-forme particulière. Il se comportera comme Windows ou Mac suivant ce que fait le modèle d'événement natif.</dd> +</dl> + +<p class="note"><strong>Note :</strong> le déclenchement manuel d'un événement ne génère <em>pas</em> l'action par défaut associée à cet événement. Par exemple, le déclenchement manuel d'un événement touche n'entraîne pas l'apparition de cette lettre dans une zone de saisie de texte ayant la focalisation. Dans le cas des événements de l'interface utilisateur, cela est important pour des raisons de sécurité, car cela empêche les scripts de simuler les actions de l'utilisateur interagissant avec le navigateur lui-même.</p> + +<h2 id="Exemple">Exemple</h2> + +<pre class="brush: js"><!DOCTYPE html> +<html> +<head> +<script> +'use strict'; + +document.addEventListener('keydown', (event) => { + const nomTouche = event.key; + + if (nomTouche === 'Control') { + // Pas d'alerte si seule la touche Control est pressée. + return; + } + + if (event.ctrlKey) { + // Même si event.key n'est pas 'Control' (par ex., 'a' is pressed), + // event.ctrlKey peut être true si la touche Ctrl est pressée dans le même temps. + alert(`Combinaison de ctrlKey + ${nomTouche}`); + } else { + alert(`Touche pressée ${nomTouche}`); + } +}, false); + +document.addEventListener('keyup', (event) => { + const nomTouche = event.key; + + // Dès que l'utilisateur relâche la touche Ctrl, la touche n'est plus active. + // Aussi event.ctrlKey est false. + if (nomTouche === 'Control') { + alert('La touche Control a été relâchée'); + } +}, false); + +</script> +</head> + +<body> +</body> +</html> +</pre> + +<h2 id="Spécifications">Spécifications</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Spécification</th> + <th scope="col">Statut</th> + <th scope="col">Commentaire</th> + </tr> + <tr> + <td>{{SpecName('UI Events', '#interface-keyboardevent', 'KeyboardEvent')}}</td> + <td>{{Spec2('UI Events')}}</td> + <td> </td> + </tr> + </tbody> +</table> + +<p>La spécification d'interface <code>KeyboardEvent</code> est passée par de nombreuses versions préliminaires, d'abord sous DOM Events Level 2 où elle a été supprimée du fait qu'aucun consensus n'avait émergé, puis sous DOM Events Level 3. Cela conduit à l'implémentation de méthodes d'initialisation non standard, la version ancienne DOM Events Level 2, {{domxref("KeyboardEvent.initKeyEvent()")}} par les navigateurs Gecko et la version prémiminaire DOM Events Level 3, {{domxref("KeyboardEvent.initKeyboardEvent()")}} par d'autres navigateurs. Tous deux ont été remplacés par l'utilisation moderne d'un constructeur : {{domxref ("KeyboardEvent.KeyboardEvent", "KeyboardEvent()")}}.</p> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + + + +<p>{{Compat("api.KeyboardEvent")}}</p> + +<h2 id="Voir_aussi">Voir aussi</h2> + +<ul> + <li>{{domxref("KeyboardEvent.code")}}.</li> + <li>{{domxref("KeyboardEvent.key")}}.</li> + <li>{{domxref("KeyboardEvent.getModifierState")}}</li> +</ul> diff --git a/files/fr/web/api/keyboardevent/key/index.html b/files/fr/web/api/keyboardevent/key/index.html new file mode 100644 index 0000000000..cf51e90dc4 --- /dev/null +++ b/files/fr/web/api/keyboardevent/key/index.html @@ -0,0 +1,227 @@ +--- +title: KeyboardEvent.key +slug: Web/API/KeyboardEvent/key +tags: + - API + - DOM + - KeyboardEvent + - Lecture-seule + - Propriété + - Reference + - UI Events +translation_of: Web/API/KeyboardEvent/key +--- +<p>{{APIRef("DOM Events")}}</p> + +<p>La propriété en lecture seule de <code>key</code> de l'interface {{domxref("KeyboardEvent")}} retourne la valeur d’une ou plusieurs touches pressées par l’utilisateur, tout en tenant compte de l'état des touches de modification telles que la touche <kbd>Shift</kbd> (<em>majuscules</em>) ainsi que les paramètres régionaux des clavier et mise en page. Ce peut être l’une des valeurs suivantes :</p> + +<div class="pull-aside moreinfo"> +<h4 id="Valeurs_des_touches">Valeurs des touches</h4> + +<p>Voir une liste complète des <a href="https://developer.mozilla.org/fr/docs/Web/API/KeyboardEvent/key/Key_Values">valeurs de touches</a></p> +</div> + +<ul> + <li> + <p>Si la valeur a une représentation d’impression, ce sera une chaîne de caractères Unicode non vide</p> + </li> + <li>Si la valeur est une touche de contrôle, une des <a href="#Key_values">valeurs de touches pré-définies</a>.</li> + <li>Si l’<code>KeyboardEvent</code> est causé par l’appui sur une touche morte, la valeur de la touche sera "<code>Dead</code>".</li> + <li>Certaines touches de clavier spécialisées (telles que les touches étendues de contrôle des médias sur les claviers multimédias) ne génèrent pas de codes de touches sous Windows ; à la place, ils déclenchent les événements <code>WM_APPCOMMAND</code>. Ces événements sont connectés aux événements de clavier DOM et sont répertoriés parmi les «codes de touche virtuelle» pour Windows, même s'ils ne sont pas réellement des codes de touche.</li> + <li>Si la valeur ne peut être identifiée, '<code>Unidentified</code>' sera retourné.</li> +</ul> + +<h2 id="Séquence_KeyboardEvent">Séquence KeyboardEvent</h2> + +<p>Les événements <code>KeyboardEvents</code> sont déclenchés selon une séquence prédéterminée, et la compréhension de ces éléments contribuera à comprendre la valeur de la propriété <code>key</code> pour un événement <code>KeyboardEvent</code> particulier. Pour une touche donnée, la séquence de KeyboardEvents est la suivante, en supposant que {{domxref ("Event.preventDefault")}} n'est pas appelée :</p> + +<ol> + <li>Un événement {{domxref("Element/keydown_event", "keydown")}} (<em>touche abaissée</em>) est d'abord déclenché. Si la touche est maintenue enfoncée et que la touche est une touche de caractère, l'événement continue d'être émis dans un intervalle dépendant de l'implémentation de la plateforme, et la propriété en lecture seule {{domxref ("KeyboardEvent.repeat")}} est définie sur <code>true</code> (<em>vrai</em>).</li> + <li>Si la touche est une touche de caractère qui entraînerait l'insertion d'un caractère dans {{HTMLElement ("entrée")}}, {{HTMLElement ("textarea")}} ou un élément dont {{domxref ("HTMLElement. contentEditable ")}} a la valeur <code>true</code>, les types d'événements {{domxref("HTMLElement/beforeinput_event", "beforeinput")}} et {{domxref("HTMLElement/input_event", "input")}} sont déclenchés dans cet ordre. Notez que d'autres implémentations peuvent déclencher l'événement {{event ("keypress")}} si elles sont prises en charge. Les événements seront déclenchés à plusieurs reprises tant que la touche est maintenue enfoncée.</li> + <li>Un évènement {{domxref("Element/keyup_event", "keyup")}} est déclenché une fois la touche relachée. Ceci complète le processus.</li> +</ol> + +<p>Dans les étapes 1 et 3, l'attribut <code>KeyboardEent.key</code> est défini et est déclaré à une valeur appropriée en fonction des règles définies.</p> + +<h2 id="Exemple_de_séquence_KeyboardEvent">Exemple de séquence KeyboardEvent</h2> + +<p>Considérez la séquence d'événements générée lorsque nous interagissons avec la touche <kbd>Shift</kbd> et la touche <kbd>2</kbd> en utilisant un clavier américain et un clavier britannique.</p> + +<p>Essayez d'expérimenter en utilisant les deux cas de test suivants :</p> + +<ol> + <li>Maintenez la touche <kbd>shift</kbd> enfoncée, puis appuyez sur <kbd>2</kbd> et relâchez-la. Ensuite, relâchez la touche <kbd>shift</kbd>.</li> + <li>Maintenez la touche <code>shift</code> enfoncée, puis appuyez sur <kbd>2</kbd>. Relâchez la touche <kbd>shift</kbd>. Finalement, relâchez la touche <kbd>2</kbd>.</li> +</ol> + +<h3 id="HTML">HTML</h3> + +<pre class="brush: html line-numbers language-html"><code class="language-html"><span class="tag token"><span class="tag token"><span class="punctuation token"><</span>div</span> <span class="attr-name token">class</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>fx<span class="punctuation token">"</span></span><span class="punctuation token">></span></span> + <span class="tag token"><span class="tag token"><span class="punctuation token"><</span>div</span><span class="punctuation token">></span></span> + <span class="tag token"><span class="tag token"><span class="punctuation token"><</span>textarea</span> <span class="attr-name token">rows</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>5<span class="punctuation token">"</span></span> <span class="attr-name token">name</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>test-target<span class="punctuation token">"</span></span> <span class="attr-name token">id</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>test-target<span class="punctuation token">"</span></span><span class="punctuation token">></span></span><span class="tag token"><span class="tag token"><span class="punctuation token"></</span>textarea</span><span class="punctuation token">></span></span> + <span class="tag token"><span class="tag token"><span class="punctuation token"><</span>button</span> <span class="attr-name token">type</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>button<span class="punctuation token">"</span></span> <span class="attr-name token">name</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>btn-clear-console<span class="punctuation token">"</span></span> <span class="attr-name token">id</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>btn-clear-console<span class="punctuation token">"</span></span><span class="punctuation token">></span></span>clear console<span class="tag token"><span class="tag token"><span class="punctuation token"></</span>button</span><span class="punctuation token">></span></span> + <span class="tag token"><span class="tag token"><span class="punctuation token"></</span>div</span><span class="punctuation token">></span></span> + <span class="tag token"><span class="tag token"><span class="punctuation token"><</span>div</span> <span class="attr-name token">class</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>flex<span class="punctuation token">"</span></span><span class="punctuation token">></span></span> + <span class="tag token"><span class="tag token"><span class="punctuation token"><</span>div</span> <span class="attr-name token">id</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>console-log<span class="punctuation token">"</span></span><span class="punctuation token">></span></span><span class="tag token"><span class="tag token"><span class="punctuation token"></</span>div</span><span class="punctuation token">></span></span> + <span class="tag token"><span class="tag token"><span class="punctuation token"></</span>div</span><span class="punctuation token">></span></span> +<span class="tag token"><span class="tag token"><span class="punctuation token"></</span>div</span><span class="punctuation token">></span></span></code></pre> + +<h3 id="CSS">CSS</h3> + +<pre class="brush: css line-numbers language-css"><code class="language-css"><span class="selector token"><span class="class token">.fx</span> </span><span class="punctuation token">{</span> + <span class="property token">-webkit-display</span><span class="punctuation token">:</span> flex<span class="punctuation token">;</span> + <span class="property token">display</span><span class="punctuation token">:</span> flex<span class="punctuation token">;</span> + <span class="property token">margin-left</span><span class="punctuation token">:</span> -<span class="number token">20</span>px<span class="punctuation token">;</span> + <span class="property token">margin-right</span><span class="punctuation token">:</span> -<span class="number token">20</span>px<span class="punctuation token">;</span> +<span class="punctuation token">}</span> + +<span class="selector token"><span class="class token">.fx</span> > div </span><span class="punctuation token">{</span> + <span class="property token">padding-left</span><span class="punctuation token">:</span> <span class="number token">20</span>px<span class="punctuation token">;</span> + <span class="property token">padding-right</span><span class="punctuation token">:</span> <span class="number token">20</span>px<span class="punctuation token">;</span> +<span class="punctuation token">}</span> + +<span class="selector token"><span class="class token">.fx</span> > div<span class="pseudo-class token">:first-child</span> </span><span class="punctuation token">{</span> + <span class="property token">width</span><span class="punctuation token">:</span> <span class="number token">30%</span><span class="punctuation token">;</span> +<span class="punctuation token">}</span> + +<span class="selector token"><span class="class token">.flex</span> </span><span class="punctuation token">{</span> + <span class="property token">-webkit-flex</span><span class="punctuation token">:</span> <span class="number token">1</span><span class="punctuation token">;</span> + <span class="property token">flex</span><span class="punctuation token">:</span> <span class="number token">1</span><span class="punctuation token">;</span> +<span class="punctuation token">}</span> + +<span class="selector token"><span class="id token">#test-target</span> </span><span class="punctuation token">{</span> + <span class="property token">display</span><span class="punctuation token">:</span> block<span class="punctuation token">;</span> + <span class="property token">width</span><span class="punctuation token">:</span> <span class="number token">100%</span><span class="punctuation token">;</span> + <span class="property token">margin-bottom</span><span class="punctuation token">:</span> <span class="number token">10</span>px<span class="punctuation token">;</span> +<span class="punctuation token">}</span></code></pre> + +<h3 id="JavaScript">JavaScript</h3> + +<pre class="brush: js line-numbers language-js"><code class="language-js"><span class="keyword token">let</span> textarea <span class="operator token">=</span> document<span class="punctuation token">.</span><span class="function token">getElementById</span><span class="punctuation token">(</span><span class="string token">'test-target'</span><span class="punctuation token">)</span><span class="punctuation token">,</span> +consoleLog <span class="operator token">=</span> document<span class="punctuation token">.</span><span class="function token">getElementById</span><span class="punctuation token">(</span><span class="string token">'console-log'</span><span class="punctuation token">)</span><span class="punctuation token">,</span> +btnClearConsole <span class="operator token">=</span> document<span class="punctuation token">.</span><span class="function token">getElementById</span><span class="punctuation token">(</span><span class="string token">'btn-clear-console'</span><span class="punctuation token">)</span><span class="punctuation token">;</span> + +<span class="keyword token">function</span> <span class="function token">logMessage</span><span class="punctuation token">(</span>message<span class="punctuation token">)</span> <span class="punctuation token">{</span> + <span class="keyword token">let</span> p <span class="operator token">=</span> document<span class="punctuation token">.</span><span class="function token">createElement</span><span class="punctuation token">(</span><span class="string token">'p'</span><span class="punctuation token">)</span><span class="punctuation token">;</span> + p<span class="punctuation token">.</span><span class="function token">appendChild</span><span class="punctuation token">(</span>document<span class="punctuation token">.</span><span class="function token">createTextNode</span><span class="punctuation token">(</span>message<span class="punctuation token">)</span><span class="punctuation token">)</span><span class="punctuation token">;</span> + consoleLog<span class="punctuation token">.</span><span class="function token">appendChild</span><span class="punctuation token">(</span>p<span class="punctuation token">)</span><span class="punctuation token">;</span> +<span class="punctuation token">}</span> + +textarea<span class="punctuation token">.</span><span class="function token">addEventListener</span><span class="punctuation token">(</span><span class="string token">'keydown'</span><span class="punctuation token">,</span> <span class="punctuation token">(</span>e<span class="punctuation token">)</span> <span class="operator token">=</span><span class="operator token">></span> <span class="punctuation token">{</span> + <span class="keyword token">if</span> <span class="punctuation token">(</span><span class="operator token">!</span>e<span class="punctuation token">.</span>repeat<span class="punctuation token">)</span> + <span class="function token">logMessage</span><span class="punctuation token">(</span>`first keydown event<span class="punctuation token">.</span> key property value is <span class="string token">"${e.key}"</span><span class="template-string token"><span class="string token">`); + else + logMessage(`</span></span>keydown event repeats<span class="punctuation token">.</span> key property value is <span class="string token">"${e.key}"</span>`<span class="punctuation token">)</span><span class="punctuation token">;</span> +<span class="punctuation token">}</span><span class="punctuation token">)</span><span class="punctuation token">;</span> + +textarea<span class="punctuation token">.</span><span class="function token">addEventListener</span><span class="punctuation token">(</span><span class="string token">'beforeinput'</span><span class="punctuation token">,</span> <span class="punctuation token">(</span>e<span class="punctuation token">)</span> <span class="operator token">=</span><span class="operator token">></span> <span class="punctuation token">{</span> + <span class="function token">logMessage</span><span class="punctuation token">(</span>`beforeinput event<span class="punctuation token">.</span> you are about inputing <span class="string token">"${e.data}"</span>`<span class="punctuation token">)</span><span class="punctuation token">;</span> +<span class="punctuation token">}</span><span class="punctuation token">)</span><span class="punctuation token">;</span> + +textarea<span class="punctuation token">.</span><span class="function token">addEventListener</span><span class="punctuation token">(</span><span class="string token">'input'</span><span class="punctuation token">,</span> <span class="punctuation token">(</span>e<span class="punctuation token">)</span> <span class="operator token">=</span><span class="operator token">></span> <span class="punctuation token">{</span> + <span class="function token">logMessage</span><span class="punctuation token">(</span>`input event<span class="punctuation token">.</span> you have just inputed <span class="string token">"${e.data}"</span>`<span class="punctuation token">)</span><span class="punctuation token">;</span> +<span class="punctuation token">}</span><span class="punctuation token">)</span><span class="punctuation token">;</span> + +textarea<span class="punctuation token">.</span><span class="function token">addEventListener</span><span class="punctuation token">(</span><span class="string token">'keyup'</span><span class="punctuation token">,</span> <span class="punctuation token">(</span>e<span class="punctuation token">)</span> <span class="operator token">=</span><span class="operator token">></span> <span class="punctuation token">{</span> + <span class="function token">logMessage</span><span class="punctuation token">(</span>`keyup event<span class="punctuation token">.</span> key property value is <span class="string token">"${e.key}"</span>`<span class="punctuation token">)</span><span class="punctuation token">;</span> +<span class="punctuation token">}</span><span class="punctuation token">)</span><span class="punctuation token">;</span> + +btnClearConsole<span class="punctuation token">.</span><span class="function token">addEventListener</span><span class="punctuation token">(</span><span class="string token">'click'</span><span class="punctuation token">,</span> <span class="punctuation token">(</span>e<span class="punctuation token">)</span> <span class="operator token">=</span><span class="operator token">></span> <span class="punctuation token">{</span> + <span class="keyword token">let</span> child <span class="operator token">=</span> consoleLog<span class="punctuation token">.</span>firstChild<span class="punctuation token">;</span> + <span class="keyword token">while</span> <span class="punctuation token">(</span>child<span class="punctuation token">)</span> <span class="punctuation token">{</span> + consoleLog<span class="punctuation token">.</span><span class="function token">removeChild</span><span class="punctuation token">(</span>child<span class="punctuation token">)</span><span class="punctuation token">;</span> + child <span class="operator token">=</span> consoleLog<span class="punctuation token">.</span>firstChild<span class="punctuation token">;</span> + <span class="punctuation token">}</span> +<span class="punctuation token">}</span><span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre> + +<h3 id="Résultat">Résultat</h3> + +<p>{{EmbedLiveSample('Exemple_de_séquence_KeyboardEvent')}}</p> + +<div class="blockIndicator note"> +<p><strong>Note :</strong> Sur les navigateurs qui n'implémentent pas complètement l'interface {{domxref("InputEvent")}} qui est utilisée pour les événements {{domxref("HTMLElement/beforeinput_event", "beforeinput")}} et {{domxref("HTMLElement/input_event", "input")}}, vous pouvez obtenir une réponse incorrecte sur ces lignes du journal de sortie.</p> +</div> + +<h3 id="Cas_1">Cas 1</h3> + +<p>Lorsque la touche Maj (<em>shift</em>) est enfoncée, un événement {{domxref("Element/keydown_event", "keydown")}} est d'abord déclenché et la valeur de la propriété <code>key</code> est définie sur la chaîne <code>"Shift"</code>. Comme nous gardons cette touche enfoncée, l'événement {{event ("keydown")}} est continu et ne se répéte pas car la touche Maj ne produit pas de caractère.</p> + +<p>Lorsque la <code>key 2</code> est enfoncée, un autre événement {{domxref("Element/keydown_event", "keydown")}} est déclenché pour cette nouvelle touche, et la valeur de la propriété <code>key</code> pour l'événement est définie sur la chaîne <code>"@"</code> pour le clavier de type américain et <code>"""</code> pour le clavier de type britannique, à cause de la touche de changement de modificateur active. Les événements {{domxref("HTMLElement/beforeinput_event", "beforeinput")}} et {{domxref("HTMLElement/input_event", "input")}} sont déclenchés ensuite parce qu'une touche de caractère a été activée.</p> + +<p>Lorsque nous relâchons la <code>key 2</code>, un événement {{domxref("Element/keyup_event", "keyup")}} est déclenché et la propriété <code>key</code> conserve les valeurs de chaîne <code>"@"</code> et <code>"""</code> pour les différents claviers respectivement.</p> + +<p>Lorsque nous relâchons enfin la touche <code>shift</code>, un autre événement {{domxref("Element/keyup_event", "keyup")}} est déclenché pour elle, et la valeur de l'attribut de la touche reste <code>"Shift"</code>.</p> + +<h3 id="Cas_2">Cas 2</h3> + +<p>Lorsque la touche Maj est enfoncée, un événement {{domxref("Element/keydown_event", "keydown")}} est d'abord déclenché et la valeur de la propriété <code>key</code> est définie sur la chaîne "Shift". Comme nous maintenons cette touche enfoncée, l'événement {{domxref("Element/keydown_event", "keydown")}} est continu et ne se répéte pas car la touche Maj ne produit pas de caractère.</p> + +<p>Lorsque la <code>key 2</code> est enfoncée, un autre événement {{domxref("Element/keydown_event", "keydown")}} est déclenché pour cette nouvelle touche, et la valeur de la propriété <code>key</code> pour l'événement est définie sur la chaîne <code>"@"</code> pour le clavier de type américain et <code>"""</code> pour le clavier de type britanique, à cause de la touche de changement de modificateur active. Les événements {{domxref("HTMLElement/beforeinput_event", "beforeinput")}} et {{domxref("HTMLElement/input_event", "input")}} sont déclenchés ensuite parce qu'une touche de caractère a été activée. Comme nous maintenons la touche enfoncée, l'événement {{domxref("Element/keydown_event", "keydown")}} continue à se déclencher à plusieurs reprises et la propriété {{domxref ("KeyboardEvent.repeat")}} est définie sur <code>true</code>. Les évènements {{domxref("HTMLElement/beforeinput_event", "beforeinput")}} et {{domxref("HTMLElement/input_event", "input")}} sont également déclenchés.</p> + +<p>Lorsque nous relâchons la touche <code>shift</code>, un événement {{domxref("Element/keyup_event", "keyup")}} est déclenché et la valeur de l'attribut clé reste "Shift". À ce stade, notez que la valeur de la propriété <code>key</code> pour l'événement de répétition du clavier de la touche <code>key 2</code> est désormais "2" car la touche de modification du sélecteur n'est plus active. Il en va de même pour la propriété {{domxref("HTMLElement/beforeinput_event", "beforeinput")}} des événements {{domxref("HTMLElement/input_event", "input")}} et {{event ("input")}}.</p> + +<p>Lorsque nous relâchons enfin la touche <code>key 2</code>, un événement {{domxref("Element/keyup_event", "keyup")}} est déclenché mais la propriété <code>key</code> est définie sur la valeur de chaîne <code>"2"</code> pour les deux configurations de clavier car la touche de modification <code>shift</code> n'est plus active.</p> + +<h2 id="Exemple">Exemple</h2> + +<p><span id="result_box" lang="fr"><span>Cet exemple utilise {{domxref("EventTarget.addEventListener()")}} pour écouter les événements </span></span> {{domxref("Element/keydown_event", "keydown")}} <span lang="fr"><span>.</span> <span>Quand ils se produisent, la valeur de la touche est vérifiée pour voir si c'est l'une des touches qui intéressent le code, et si c'est le cas, elle est traitée (éventuellement en pilotant un vaisseau spatial, peut-être en changeant la cellule sélectionnée dans une feuille de calcul</span><span>).</span></span></p> + +<pre class="brush: js">window.addEventListener("keydown", function (event) { + if (event.defaultPrevented) { + return; // Ne devrait rien faire si l'événement de la touche était déjà consommé. + } + + switch (event.key) { + case "ArrowDown": + // Faire quelque chose pour la touche "flèche vers le bas" pressée. + break; + case "ArrowUp": + // Faire quelque chose pour la touche "up arrow" pressée. + break; + case "ArrowLeft": + // Faire quelque chose pour la touche "left arrow" pressée. + break; + case "ArrowRight": + // Faire quelque chose pour la touche "right arrow" pressée. + break; + case "Enter": + // Faire quelque chose pour les touches "enter" ou "return" pressées. + break; + case "<code>Escape</code>": + // Faire quelque chose pour la touche "esc" pressée. + break; + default: + return; // Quitter lorsque cela ne gère pas l'événement touche. + } + + // Annuler l'action par défaut pour éviter qu'elle ne soit traitée deux fois. + event.preventDefault(); +}, true); +</pre> + +<h2 id="Spécification">Spécification</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Spécification</th> + <th scope="col">Statut</th> + <th scope="col">Commentaire</th> + </tr> + <tr> + <td>{{SpecName('DOM3 Events', '#widl-KeyboardEvent-key', 'KeyboardEvent.key')}}</td> + <td>{{Spec2('DOM3 Events')}}</td> + <td>Définition initiale, incluant les valeurs de touches.</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + + + +<p>{{Compat("api.KeyboardEvent.key")}}</p> + +<div id="compat-desktop"></div> + +<div id="compat-mobile"></div> diff --git a/files/fr/web/api/keyboardevent/key/key_values/index.html b/files/fr/web/api/keyboardevent/key/key_values/index.html new file mode 100644 index 0000000000..a61f42654e --- /dev/null +++ b/files/fr/web/api/keyboardevent/key/key_values/index.html @@ -0,0 +1,3639 @@ +--- +title: Key Values +slug: Web/API/KeyboardEvent/key/Key_Values +translation_of: Web/API/KeyboardEvent/key/Key_Values +--- +<p>Les tableaux ci-dessous énumèrent les valeurs clés standard dans différentes catégories de clés, avec une explication de l'utilisation habituelle de la clé. Les codes de clés virtuels correspondants pour les plateformes communes sont inclus lorsqu'ils sont disponibles.</p> + +<div class="pull-aside"> +<div class="moreinfo">Apprenez à utiliser ces valeurs clés en JavaScript en utilisant <a href="/fr/docs/Web/API/KeyboardEvent/key">KeyboardEvent.key</a></div> +</div> + +<p><a href="#Special_values">Special Values </a>| <a href="#Modifier_keys">Modifier Keys</a> | <a href="#Whitespace_keys">Whitespace Keys</a> | <a href="#Navigation_keys">Navigation Keys</a> | <a href="#Editing_keys">Editing Keys</a> | <a href="#UI_keys">UI Keys</a> | <a href="#Device_keys">Device Keys</a> | <a href="#IME_and_composition_keys">IME and Composition Keys</a> | <a href="#Function_keys">Function Keys</a> | <a href="#Phone_keys">Phone Keys</a> | <a href="#Multimedia_keys">Multimedia Keys</a> | <a href="#Audio_control_keys">Audio Control Keys</a> | <a href="#TV_control_keys">TV Control Keys</a> | <a href="#Media_controller_keys">Media Controller Keys</a> | <a href="#Speech_recognition_keys">Speech Recognition Keys</a> | <a href="#Document_keys">Document Keys</a> | <a href="#Application_selector_keys">Application Selector Keys</a> | <a href="#Browser_control_keys">Browser Control Keys</a> | <a href="#Numeric_keypad_keys">Numeric Keypad Keys</a></p> + +<h2 id="Valeurs_spéciales">Valeurs spéciales</h2> + +<p>Les valeurs de <code>key</code> qui ont une signification particulière autre que l'identification d'une clé ou d'un caractère spécifique.</p> + +<table class="standard-table"> + <thead> + <tr> + <th rowspan="2" scope="col" style="text-align: left;"><code>KeyboardEvent.key</code> Valeur</th> + <th rowspan="2" scope="col" style="text-align: left;">Description</th> + <th colspan="4" scope="col" style="text-align: center;">Code clé virtuel</th> + </tr> + <tr> + <th scope="col" style="text-align: left;">Windows</th> + <th scope="col" style="text-align: left;">Mac</th> + <th scope="col" style="text-align: left;">Linux</th> + <th scope="col" style="text-align: left;">Android</th> + </tr> + </thead> + <tbody> + <tr> + <td><code>"Unidentified"</code></td> + <td>L'agent utilisateur n'a pas été en mesure de faire correspondre le code virtuel de l'événement à une valeur clé spécifique. Cela peut être dû à des contraintes matérielles ou logicielles, ou à des contraintes liées à la plate-forme sur laquelle l'agent utilisateur fonctionne.</td> + <td><em>varie</em></td> + <td><em>varie</em></td> + <td><em>varie</em></td> + <td><em>varie</em></td> + </tr> + </tbody> +</table> + +<h2 id="Modifier_keys">Modifier keys</h2> + +<p>Modifiers are special keys which are used to generate special characters or cause special actions when used in combination with other keys. Examples include the <kbd>Shift</kbd> and <kbd>Control</kbd> keys, and lock keys such as <kbd>Caps Lock</kbd> and <kbd>NumLock</kbd>.</p> + +<table class="standard-table"> + <thead> + <tr> + <th rowspan="2" scope="col" style="text-align: left;"><code>KeyboardEvent.key</code> Value</th> + <th rowspan="2" scope="col" style="text-align: left;">Description</th> + <th colspan="4" scope="col" style="text-align: center;">Virtual Keycode</th> + </tr> + <tr> + <th scope="col" style="text-align: left;">Windows</th> + <th scope="col" style="text-align: left;">Mac</th> + <th scope="col" style="text-align: left;">Linux</th> + <th scope="col" style="text-align: left;">Android</th> + </tr> + <tr> + <td><code>"Alt"</code> [5]</td> + <td>The <kbd>Alt</kbd> (Alternative) key.</td> + <td><code>VK_MENU</code> (0x12)<br> + <code>VK_LMENU</code> (0xA4)<br> + <code>VK_RMENU</code> (0xA5)</td> + <td><code>kVK_Option</code> (0x3A)<br> + <code>kVK_RightOption</code> (0x3D)</td> + <td><code>GDK_KEY_Alt_L</code> (0xFFE9)<br> + <code>GDK_KEY_Alt_R</code> (0xFFEA)<br> + <code>Qt::Key_Alt</code> (0x01000023)</td> + <td><code>KEYCODE_ALT_LEFT</code> (57)<br> + <code>KEYCODE_ALT_RIGHT</code> (58)</td> + </tr> + <tr> + <td><code>"AltGraph"</code> [5]</td> + <td>The <kbd>AltGr</kbd> or <kbd>AltGraph</kbd> (Alternate Graphics) key. Enables the ISO Level 3 shift modifier (where <kbd>Shift</kbd> is the level 2 modifier).</td> + <td></td> + <td></td> + <td><code>GDK_KEY_Mode_switch</code> (0xFF7E)<br> + <code>GDK_KEY_ISO_Level3_Shift</code> (0xFE03)<br> + <code>GDK_KEY_ISO_Level3_Latch</code> (0xFE04)<br> + <code>GDK_KEY_ISO_Level3_Lock</code> (0xFE05)<br> + <code>GDK_KEY_ISO_Level5_Shift</code> (0xFE11)<br> + <code>GDK_KEY_ISO_Level5_Latch</code> (0xFE12)<br> + <code>GDK_KEY_ISO_Level5_Lock</code> (0xFE13)<br> + <code>Qt::Key_AltGr</code> (0x01001103<br> + <code>Qt::Key_Mode_switch</code> (0x0100117E)</td> + <td></td> + </tr> + <tr> + <td><code>"CapsLock"</code></td> + <td>The <kbd>Caps Lock</kbd> key. Toggles the capital character lock on and off for subsequent input.</td> + <td><code>VK_CAPITAL</code> (0x14)</td> + <td><code>kVK_CapsLock</code> (0x39)</td> + <td><code>GDK_KEY_Caps_Lock</code> (0xFFE5)<br> + <code>Qt::Key_CapsLock</code> (0x01000024)</td> + <td><code>KEYCODE_CAPS_LOCK</code> (115)</td> + </tr> + <tr> + <td><code>"Control"</code></td> + <td>The <kbd>Control</kbd>, <kbd>Ctrl</kbd>, or <kbd>Ctl</kbd> key. Allows typing control characters.</td> + <td><code>VK_CONTROL</code> (0x11)<br> + <code>VK_LCONTROL</code> (0xA2)<br> + <code>VK_RCONTROL</code> (0xA3)</td> + <td><code>kVK_Control</code> (0x3B)<br> + <code>kVK_RightControl</code> (0x3E)</td> + <td><code>GDK_KEY_Control_L</code> (0xFFE3)<br> + <code>GDK_KEY_Control_R</code> (0xFFE4)<br> + <code>Qt::Key_Control</code> (0x01000021)</td> + <td><code>KEYCODE_CTRL_LEFT</code> (113)<br> + <code>KEYCODE_CTRL_RIGHT</code> (114)</td> + </tr> + <tr> + <td><code>"Fn"</code></td> + <td>The <kbd>Fn</kbd> (Function modifier) key. Used to allow generating function key (<kbd>F1</kbd>-<kbd>F15</kbd>, for instance) characters on keyboards without a dedicated function key area. Often handled in hardware so that events aren't generated for this key.</td> + <td></td> + <td><code>kVK_Function</code> (0x3F)</td> + <td></td> + <td><code>KEYCODE_FUNCTION</code> (119)</td> + </tr> + <tr> + <td><code>"FnLock"</code></td> + <td>The <kbd>FnLock</kbd> or <kbd>F-Lock</kbd> (Function Lock) key.Toggles the function key mode described by "Fn" on and off. Often handled in hardware so that events aren't generated for this key.</td> + <td></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>"Hyper"</code> [4]</td> + <td>The <kbd>Hyper</kbd> key.</td> + <td></td> + <td></td> + <td><code>GDK_KEY_Hyper_L</code> (0xFFED)<br> + <code>GDK_KEY_Hyper_R</code> (0xFFEE)<br> + <code>Qt::Key_Hyper_L</code> (0x01000056)<br> + <code>Qt::Key_Hyper_R</code> (0x01000057)</td> + <td></td> + </tr> + <tr> + <td><code>"Meta"</code> [1]</td> + <td>The <kbd>Meta</kbd> key. Allows issuing special command inputs. This is the <kbd>Windows</kbd> logo key, or the <kbd>Command</kbd> or <kbd>⌘</kbd> key on Mac keyboards.</td> + <td><code>VK_LWIN</code> (0x5B)<br> + <code>VK_RWIN</code> (0x5C)</td> + <td><code>kVK_Command</code> (0x37)<br> + <code>kVK_RightCommand</code> (0x36)</td> + <td><code>GDK_KEY_Meta_L</code> (0xFFE7)<br> + <code>GDK_KEY_Meta_R</code> (0xFFE8)<br> + <code>Qt::Key_Meta</code> (0x01000022)</td> + <td><code>KEYCODE_META_LEFT</code> (117)<br> + <code>KEYCODE_META_RIGHT</code> (118)</td> + </tr> + <tr> + <td><code>"NumLock"</code></td> + <td>The <kbd>NumLock</kbd> (Number Lock) key. Toggles the numeric keypad between number entry some other mode (often directional arrows).</td> + <td><code>VK_NUMLOCK</code> (0x90)</td> + <td></td> + <td><code>GDK_KEY_Num_Lock</code> (0xFF7F)<br> + <code>Qt::Key_NumLock</code> (0x01000025)</td> + <td><code>KEYCODE_NUM_LOCK</code> (143)</td> + </tr> + <tr> + <td><code>"ScrollLock"</code> [2]</td> + <td>The <kbd>Scroll Lock</kbd> key. Toggles beteen scrolling and cursor movement modes.</td> + <td><code>VK_SCROLL</code> (0x91)</td> + <td></td> + <td><code>GDK_KEY_Scroll_Lock</code> (0xFF14)<br> + <code>Qt::Key_ScrollLock</code> (0x01000026)</td> + <td><code>KEYCODE_SCROLL_LOCK</code> (116)</td> + </tr> + <tr> + <td><code>"Shift"</code></td> + <td>The <kbd>Shift</kbd> key. Modifies keystrokes to allow typing upper (or other) case letters, and to support typing punctuation and other special characters.</td> + <td><code>VK_SHIFT</code> (0x10)<br> + <code>VK_LSHIFT</code> (0xA0)<br> + <code>VK_RSHIFT</code> (0xA1)</td> + <td><code>kVK_Shift</code> (0x38)<br> + <code>kVK_RightShift</code> (0x3C)</td> + <td><code>GDK_KEY_Shift_L</code> (0xFFE1)<br> + <code>GDK_KEY_Shift_R</code> (0xFFE2)<br> + <code>Qt::Key_Shift</code> (0x01000020)</td> + <td><code>KEYCODE_SHIFT_LEFT</code> (59)<br> + <code>KEYCODE_SHIFT_RIGHT</code> (60)</td> + </tr> + <tr> + <td><code>"Super"</code> [4]</td> + <td>The <kbd>Super</kbd> key.</td> + <td></td> + <td></td> + <td><code>GDK_KEY_Super_L</code> (0xFFEB)<br> + <code>GDK_KEY_Super_R</code> (0xFFEC)<br> + <code>Qt::Key_Super_L</code> (0x01000053)<br> + <code>Qt::Key_Super_R</code> (0x01000054)</td> + <td></td> + </tr> + <tr> + <td><code>"Symbol"</code></td> + <td>The <kbd>Symbol</kbd> modifier key (found on certain virtual keyboards).</td> + <td></td> + <td></td> + <td></td> + <td><code>KEYCODE_SYM</code> (63) [3]</td> + </tr> + <tr> + <td><code>"SymbolLock"</code></td> + <td>The <kbd>Symbol Lock</kbd> key.</td> + <td></td> + <td></td> + <td></td> + <td></td> + </tr> + </thead> +</table> + +<p>[1] In Internet Explorer (tested on release 9 and 11), as well as in all versions of Firefox, the <kbd>Windows</kbd> key is reported as <code>"OS"</code> instead of as <code>"Meta"</code>. This will be changed in Firefox per {{bug(1232918)}}. Until that's fixed, these keys are returned as <code>"OS"</code> by Firefox: <code>VK_LWIN</code> (0x5B) and <code>VK_RWIN</code> (0x5C) on Windows, and <code><code>GDK_KEY_Super_L</code> (0xFFEB)</code>, <code><code>GDK_KEY_Super_R</code> (0xFFEC)</code>, <code><code>GDK_KEY_Hyper_L</code> (0xFFED)</code>, and <code><code>GDK_KEY_Hyper_R</code> (0xFFEE)</code> on Linux.</p> + +<p>[2] Internet Explorer (tested on release 9 and 11) reports <code>"Scroll"</code> instead of <code>"ScrollLock"</code> for the <kbd>Scroll Lock</kbd> key.</p> + +<p>[3] Firefox did not add support for the <kbd>Symbol</kbd> key until Firefox 37.</p> + +<p>[4] Firefox generates the key value <code>"OS</code>" for the <kbd>Super</kbd> and <kbd>Hyper</kbd> keys, instead of <code>"Super"</code> and <code>"Hyper"</code>.</p> + +<p>[5] Chrome 67 and Firefox 63 now correctly interpret the right <kbd>Alt</kbd> key for keyboard layouts which map that key to <kbd>AltGr</kbd>. See Firefox bug {{bug(900750)}} and <a href="https://bugs.chromium.org/p/chromium/issues/detail?id=25503">Chrome bug 25503</a> for further details.</p> + +<h2 id="Whitespace_keys">Whitespace keys</h2> + +<table class="standard-table"> + <thead> + <tr> + <th rowspan="2" scope="col" style="text-align: left;"><code>KeyboardEvent.key</code> Value</th> + <th rowspan="2" scope="col" style="text-align: left;">Description</th> + <th colspan="4" scope="col" style="text-align: center;">Virtual Keycode</th> + </tr> + <tr> + <th scope="col" style="text-align: left;">Windows</th> + <th scope="col" style="text-align: left;">Mac</th> + <th scope="col" style="text-align: left;">Linux</th> + <th scope="col" style="text-align: left;">Android</th> + </tr> + </thead> + <tbody> + <tr> + <td><code>"Enter"</code></td> + <td>The <kbd>Enter</kbd> or <kbd>↵</kbd> key (sometimes labeled <kbd>Return</kbd>).</td> + <td><code>VK_RETURN</code> (0x0D)</td> + <td><code>kVK_Return</code> (0x24)<br> + <code>kVK_ANSI_KeypadEnter</code> (0x4C)<br> + <code>kVK_Powerbook_KeypadEnter</code> (0x34)</td> + <td><code><code>GDK_KEY_Return</code> (0xFF0D)</code><br> + <code><code>GDK_KEY_KP_Enter</code> (0xFF8D)</code><br> + <code><code>GDK_KEY_ISO_Enter</code> (0xFE34)</code><br> + <code><code>GDK_KEY_3270_Enter</code> (0xFD1E)</code><br> + <code>Qt::Key_Return</code> (0x01000004)<br> + <code>Qt::Key_Enter</code> (0x01000005)</td> + <td><code>KEYCODE_ENTER</code> (66)<br> + <code>KEYCODE_NUMPAD_ENTER</code> (160)<br> + <code>KEYCODE_DPAD_CENTER</code> (23)</td> + </tr> + <tr> + <td><code>"Tab"</code></td> + <td>The Horizontal Tab key, <kbd>Tab</kbd>.</td> + <td><code>VK_TAB</code> (0x09)</td> + <td><code>kVK_Tab</code> (0x30)</td> + <td><code><code>GDK_KEY_Tab</code> (0xFF09)</code><br> + <code><code>GDK_KEY_KP_Tab</code> (0xFF89)<br> + GDK_KEY_ISO_Left_Tab</code> (0xFE20)<br> + <code>Qt::Key_Tab</code> (0x01000001)</td> + <td><code>KEYCODE_TAB</code> (61)</td> + </tr> + <tr> + <td><code>" "</code> [1]</td> + <td>The space key, <kbd>Space Bar</kbd>.</td> + <td><code>VK_SPACE</code> (0x20)</td> + <td><code>kVK_Space</code> (0x31)</td> + <td> + <p><code>GDK_KEY_space</code> (0x20)<br> + <code>GDK_KEY_KP_Space</code> (0xFF80)<br> + <code>Qt::Key_Space</code> (0x20)</p> + </td> + <td><code>KEYCODE_SPACE</code> (62)</td> + </tr> + </tbody> +</table> + +<p>[1] Older browsers may return "Spacebar" instead of " " for the <kbd>Space Bar</kbd> key. Firefox did so until version 37, as did Internet Explorer 9, 10, and 11.</p> + +<h2 id="Navigation_keys">Navigation keys</h2> + +<table class="standard-table"> + <thead> + <tr> + <th rowspan="2" scope="col" style="text-align: left;"><code>KeyboardEvent.key</code> Value</th> + <th rowspan="2" scope="col" style="text-align: left;">Description</th> + <th colspan="4" scope="col" style="text-align: center;">Virtual Keycode</th> + </tr> + <tr> + <th scope="col" style="text-align: left;">Windows</th> + <th scope="col" style="text-align: left;">Mac</th> + <th scope="col" style="text-align: left;">Linux</th> + <th scope="col" style="text-align: left;">Android</th> + </tr> + </thead> + <tbody> + <tr> + <td><code>"ArrowDown"</code> [1]</td> + <td>The down arrow key.</td> + <td><code>VK_DOWN</code> (0x28)</td> + <td><code>kVK_DownArrow</code> (0x7D)</td> + <td><code>GDK_KEY_Down</code> (0xFF54)<br> + <code>GDK_KEY_KP_Down</code> (0xFF99)<br> + <code>Qt::Key_Down</code> (0x01000015)</td> + <td><code>KEYCODE_DPAD_DOWN</code> (20)</td> + </tr> + <tr> + <td><code>"ArrowLeft"</code> [1]</td> + <td>The left arrow key.</td> + <td><code>VK_LEFT</code> (0x25)</td> + <td><code>kVK_LeftArrow</code> (0x7B)</td> + <td><code>GDK_KEY_Left</code> (0xFF51)<br> + <code>GDK_KEY_KP_Left</code> (0xFF96)<br> + <code>Qt::Key_Left</code> (0x01000012)</td> + <td><code>KEYCODE_DPAD_LEFT</code> (21)</td> + </tr> + <tr> + <td><code>"ArrowRight"</code> [1]</td> + <td>The right arrow key.</td> + <td><code>VK_RIGHT</code> (0x27)</td> + <td><code>kVK_RightArrow</code> (0x7C)</td> + <td><code>GDK_KEY_Right</code> (0xFF53)<br> + <code>GDK_KEY_KP_Right</code> (0xFF98)<br> + <code>Qt::Key_Right</code> (0x01000014)</td> + <td><code>KEYCODE_DPAD_RIGHT</code> (22)</td> + </tr> + <tr> + <td><code>"ArrowUp"</code> [1]</td> + <td>The up arrow key.</td> + <td><code>VK_UP</code><code> (0x26)</code></td> + <td><code>kVK_UpArrow</code> (0x7E)</td> + <td><code>GDK_KEY_Up</code> (0xFF52)<br> + <code>GDK_KEY_KP_Up</code> (0xFF97)<br> + <code>Qt::Key_Up</code> (0x01000013)</td> + <td><code>KEYCODE_DPAD_UP</code> (19)</td> + </tr> + <tr> + <td><code>"End"</code></td> + <td>The <kbd>End</kbd> key. Moves to the end of content.</td> + <td><code>VK_END</code> (0x23)</td> + <td><code>kVK_End</code> (0x77)</td> + <td><code>GDK_KEY_End</code> (0xFF57)<br> + <code>GDK_KEY_KP_End</code> (0xFF9C)<br> + <code>Qt::Key_End</code> (0x01000011)</td> + <td><code>KEYCODE_MOVE_END</code> (123)</td> + </tr> + <tr> + <td><code>"Home"</code></td> + <td>The <kbd>Home</kbd> key. Moves to the start of content.</td> + <td><code>VK_HOME</code> (0x24)</td> + <td><code>kVK_Home</code> (0x73)</td> + <td><code>GDK_KEY_Home</code> (0xFF50)<br> + <code>GDK_KEY_KP_Home</code> (0xFF95)<br> + <code>Qt::Key_Home</code> (0x01000010)</td> + <td><code>KEYCODE_MOVE_HOME</code> (122)</td> + </tr> + <tr> + <td><code>"PageDown"</code></td> + <td>The <kbd>Page Down</kbd> (or <kbd>PgDn</kbd>) key. Scrolls down or displays the next page of content.</td> + <td><code>VK_NEXT</code> (0x22)</td> + <td><code>kVK_PageDown</code><code> (0x79)</code></td> + <td><code>GDK_KEY_Page_Down</code> (0xFF56)<br> + <code>GDK_KEY_KP_Page_Down</code> (0xFF9B)<br> + <code>Qt::Key_PageDown</code> (0x01000017)</td> + <td><code>KEYCODE_PAGE_DOWN</code> (93)</td> + </tr> + <tr> + <td><code>"PageUp"</code></td> + <td>The <kbd>Page Up</kbd> (or <kbd>PgUp</kbd>) key. Scrolls up or displays the previous page of content.</td> + <td><code>VK_PRIOR</code> (0x21)</td> + <td><code>kVK_PageUp</code> (0x74)</td> + <td><code>GDK_KEY_Page_Up</code> (0xFF55)<br> + <code>GDK_KEY_KP_Page_Up</code> (0xFF9A)<br> + <code>Qt::Key_PageUp</code> (0x01000016)</td> + <td><code>KEYCODE_PAGE_UP</code> (92)</td> + </tr> + </tbody> +</table> + +<p>[1] Internet Explorer, Edge (16 and earlier), and Firefox (36 and earlier) use "Left", "Right", "Up", and "Down" instead of "ArrowLeft", "ArrowRight", "ArrowUp", and "ArrowDown".</p> + +<h2 id="Editing_keys">Editing keys</h2> + +<table class="standard-table"> + <thead> + <tr> + <th rowspan="2" scope="col" style="text-align: left;"><code>KeyboardEvent.key</code> Value</th> + <th rowspan="2" scope="col" style="text-align: left;">Description</th> + <th colspan="4" scope="col" style="text-align: center;">Virtual Keycode</th> + </tr> + <tr> + <th scope="col" style="text-align: left;">Windows</th> + <th scope="col" style="text-align: left;">Mac</th> + <th scope="col" style="text-align: left;">Linux</th> + <th scope="col" style="text-align: left;">Android</th> + </tr> + </thead> + <tbody> + <tr> + <td><code>"Backspace"</code></td> + <td>The <kbd>Backspace</kbd> key. This key is labeled <kbd>Delete</kbd> on Mac keyboards.</td> + <td><code>VK_BACK</code> (0x08)</td> + <td><code>kVK_Delete</code> (0x33)</td> + <td><code>GDK_KEY_BackSpace</code> (0xFF08)<br> + <code>Qt::Key_Backspace</code> (0x01000003)</td> + <td><code>KEYCODE_DEL</code> (67)</td> + </tr> + <tr> + <td><code>"Clear"</code></td> + <td>The <kbd>Clear</kbd> key. Removes the currently selected input.</td> + <td><code>VK_CLEAR</code> (0x0C)<br> + <code>VK_OEM_CLEAR</code> (0xFE)</td> + <td><code>kVK_ANSI_KeypadClear</code> (0x47)</td> + <td><code>GDK_KEY_Clear</code> (0xFF0B)<br> + <code>Qt::Key_Clear</code> (0x0100000B)</td> + <td><code>KEYCODE_CLEAR</code> (28)</td> + </tr> + <tr> + <td><code>"Copy"</code></td> + <td>The <kbd>Copy</kbd> key (on certain extended keyboards).</td> + <td><code>APPCOMMAND_COPY</code></td> + <td></td> + <td><code>GDK_KEY_Copy</code> (0x1008FF57)<br> + <code>Qt::Key_Copy</code> (0x010000CF)</td> + <td></td> + </tr> + <tr> + <td><code>"CrSel"</code> [3]</td> + <td>The Cursor Select key, <kbd>CrSel</kbd>.</td> + <td><code>VK_CRSEL</code> (0xF7)</td> + <td></td> + <td><code>GDK_KEY_3270_CursorSelect</code> (0xFD1C)</td> + <td></td> + </tr> + <tr> + <td><code>"Cut"</code></td> + <td>The <kbd>Cut</kbd> key (on certain extended keyboards).</td> + <td><code>APPCOMMAND_CUT</code></td> + <td></td> + <td><code>GDK_KEY_Cut</code> (0x1008FF58)<br> + <code>Qt::Key_Cut</code> (0x010000D0)</td> + <td></td> + </tr> + <tr> + <td><code>"Delete"</code> [2]</td> + <td>The Delete key, <kbd>Del</kbd>.</td> + <td><code>VK_DELETE</code> (0x2E)</td> + <td><code>kVK_ForwardDelete</code> (0x75) [1]</td> + <td><code>GDK_KEY_Delete</code> (0xFFFF)<br> + <code>GDK_KEY_KP_Delete</code> (0xFF9F)<br> + <code>Qt::Key_Delete</code> (0x01000007)</td> + <td><code>KEYCODE_FORWARD_DEL</code> (112)</td> + </tr> + <tr> + <td><code>"EraseEof"</code></td> + <td>Erase to End of Field. Deletes all characters from the current cursor position to the end of the current field.</td> + <td><code>VK_EREOF</code> (0xF9)</td> + <td></td> + <td><code>GDK_KEY_3270_ExSelect</code> (0xFD1B)</td> + <td></td> + </tr> + <tr> + <td><code>"ExSel"</code> [4]</td> + <td>The <kbd>ExSel</kbd> (Extend Selection) key.</td> + <td><code>VK_EXSEL</code> (0xF8)</td> + <td></td> + <td><code>GDK_KEY_3270_ExSelect</code> (0xFD1B)</td> + <td></td> + </tr> + <tr> + <td><code>"Insert"</code></td> + <td>The Insert key, <kbd>Ins</kbd>. Toggles between inserting and overwriting text.</td> + <td><code>VK_INSERT</code> (0x2D)</td> + <td></td> + <td><code>GDK_KEY_Insert</code> (0xFF63)<br> + <code>GDK_KEY_KP_Insert</code> (0xFF9E)<br> + <code>Qt::Key_Insert</code> (0x01000006)</td> + <td><code>KEYCODE_INSERT</code> (124)</td> + </tr> + <tr> + <td><code>"Paste"</code></td> + <td>Paste from the clipboard.</td> + <td><code>APPCOMMAND_PASTE</code></td> + <td></td> + <td><code>GDK_KEY_Paste</code> (0x1008FF6D)<br> + <code>Qt::Key_Paste</code> (0x010000E2)</td> + <td></td> + </tr> + <tr> + <td><code>"Redo"</code></td> + <td>Redo the last action.</td> + <td><code>APPCOMMAND_REDO</code></td> + <td></td> + <td><code>GDK_KEY_Redo</code> (0xFF66)</td> + <td></td> + </tr> + <tr> + <td><code>"Undo"</code></td> + <td>Undo the last action.</td> + <td><code>APPCOMMAND_UNDO</code></td> + <td></td> + <td><code>GDK_KEY_Undo</code> (0xFF65)</td> + <td></td> + </tr> + </tbody> +</table> + +<p>[1] On keyboards without a dedicated <kbd>Del</kbd> key, the Mac generates the <code>"Delete"</code> value when <kbd>Fn</kbd> is pressed in tandem with <kbd>Delete</kbd> (which is <kbd>Backspace</kbd> on other platforms).</p> + +<p>[2] Internet Explorer (tested on release 9 and 11) and Firefox 36 and earlier use "Del" instead of "Delete" for the <kbd>Del</kbd> key.</p> + +<p>[3] Internet Explorer (tested on release 9 and 11) and Firefox 36 and earlier generate the value <code>"Crsel"</code> instead of <code>"CrSel"</code> when the <kbd>CrSel</kbd> key is pressed.</p> + +<p>[4] Internet Explorer (tested on release 9 and 11) and Firefox 36 and earlier generate the value <code>"Exsel"</code> instead of <code>"ExSel"</code> when the <kbd>ExSel</kbd> key is pressed.</p> + +<h2 id="UI_keys">UI keys</h2> + +<table class="standard-table"> + <thead> + <tr> + <th rowspan="2" scope="col" style="text-align: left;"><code>KeyboardEvent.key</code> Value</th> + <th rowspan="2" scope="col" style="text-align: left;">Description</th> + <th colspan="4" scope="col" style="text-align: center;">Virtual Keycode</th> + </tr> + <tr> + <th scope="col" style="text-align: left;">Windows</th> + <th scope="col" style="text-align: left;">Mac</th> + <th scope="col" style="text-align: left;">Linux</th> + <th scope="col" style="text-align: left;">Android</th> + </tr> + </thead> + <tbody> + <tr> + <td><code>"Accept"</code></td> + <td>The <kbd>Accept</kbd>, <kbd>Commit</kbd>, or <kbd>OK</kbd> key or button. Accepts the currently selected option or input method sequence conversion.</td> + <td><code>VK_ACCEPT</code> (0x1E)</td> + <td></td> + <td></td> + <td><code>KEYCODE_DPAD_CENTER</code> (23)</td> + </tr> + <tr> + <td><code>"Again"</code></td> + <td>The <kbd>Again</kbd> key. Redoes or repeats a previous action.</td> + <td></td> + <td></td> + <td><code>GDK_KEY_Redo</code> (0xFF66)</td> + <td></td> + </tr> + <tr> + <td><code>"Attn"</code> [4]</td> + <td>The <kbd>Attn</kbd> (Attention) key.</td> + <td><code>VK_OEM_ATTN</code> (0xF0)</td> + <td></td> + <td><code>GDK_KEY_3270_Attn</code> (0xFD0E)</td> + <td></td> + </tr> + <tr> + <td><code>"Cancel"</code> [1]</td> + <td>The <kbd>Cancel</kbd> key.</td> + <td></td> + <td></td> + <td><code>GDK_KEY_Cancel</code> (0xFF69)</td> + <td></td> + </tr> + <tr> + <td><code>"ContextMenu"</code> [3]</td> + <td>Shows the context menu. Typically found between the <kbd>Windows</kbd> (or <kbd>OS</kbd>) key and the <kbd>Control</kbd> key on the right side of the keyboard.</td> + <td><code>VK_APPS</code> (0x5D)</td> + <td><code>kVK_PC_ContextMenu</code> (0x6E)</td> + <td><code>GDK_KEY_Menu</code> (0xFF67)<br> + <code>Qt::Key_Menu</code> (0x01000055)</td> + <td><code>KEYCODE_MENU</code> (82)</td> + </tr> + <tr> + <td><code>"Escape"</code> [2]</td> + <td>The <kbd>Esc</kbd> (Escape) key. Typically used as an exit, cancel, or "escape this operation" button. Historically, the Escape character was used to signal the start of a special control sequence of characters called an "escape sequence."</td> + <td><code>VK_ESCAPE</code> (0x1B)</td> + <td><code>kVK_Escape</code> (0x35)</td> + <td><code>GDK_KEY_Escape</code> (0xFF1B)<br> + <code>Qt::Key_Escape</code> (0x01000000)</td> + <td><code>KEYCODE_ESCAPE</code> (111)</td> + </tr> + <tr> + <td><code>"Execute"</code></td> + <td>The <kbd>Execute</kbd> key.</td> + <td><code>VK_EXECUTE</code> (0x2B)</td> + <td></td> + <td><code>Qt::Key_Execute</code> (0x01020003)</td> + <td></td> + </tr> + <tr> + <td><code>"Find"</code></td> + <td>The <kbd>Find</kbd> key. Opens an interface (typically a dialog box) for performing a find/search operation.</td> + <td><code>APPCOMMAND_FIND</code></td> + <td></td> + <td><code>GDK_KEY_Find</code> (0xFF68)</td> + <td></td> + </tr> + <tr> + <td><code>"Finish"</code> [5]</td> + <td>The <kbd>Finish</kbd> key.</td> + <td><code>VK_OEM_FINISH</code> (0xF1)</td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>"Help"</code></td> + <td>The <kbd>Help</kbd> key. Opens or toggles the display of help information.</td> + <td><code>VK_HELP</code> (0x2F)<br> + <code>APPCOMMAND_HELP</code></td> + <td><code>kVK_Help</code> (0x72)</td> + <td><code>GDK_KEY_Help</code> (0xFF6A)<br> + <code>Qt::Key_Help</code> (0x01000058)</td> + <td><code>KEYCODE_HELP</code> (259)</td> + </tr> + <tr> + <td><code>"Pause"</code></td> + <td>The <kbd>Pause</kbd> key. Pauses the current application or state, if applicable. + <div class="note">This shouldn't be confused with the <code>"MediaPause"</code> key value, which is used for media controllers, rather than to control applications and processes.</div> + </td> + <td><code>VK_PAUSE</code> (0x13)</td> + <td></td> + <td><code>GDK_KEY_Pause</code> (0xFF13)<br> + <code>GDK_KEY_Break</code> (0xFF6B)<br> + <code>Qt::Key_Pause</code> (0x01000008)</td> + <td><code>KEYCODE_BREAK</code> (121)</td> + </tr> + <tr> + <td><code>"Play"</code></td> + <td>The <kbd>Play</kbd> key. Resumes a previously paused application, if applicable. + <div class="note">This shouldn't be confused with the <code>"MediaPlay"</code> key value, which is used for media controllers, rather than to control applications and processes.</div> + </td> + <td><code>VK_PLAY</code> (0xFA)</td> + <td></td> + <td><code>GDK_KEY_3270_Play</code> (0xFD16)<br> + <code>Qt::Key_Play</code> (0x01020005)</td> + <td></td> + </tr> + <tr> + <td><code>"Props"</code></td> + <td>The <kbd>Props</kbd> (Properties) key.</td> + <td></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>"Select"</code></td> + <td>The <kbd>Select</kbd> key.</td> + <td><code>VK_SELECT</code> (0x29)</td> + <td></td> + <td><code>GDK_KEY_Select</code> (0xFF60)</td> + <td><code>KEYCODE_BUTTON_SELECT</code> (109)</td> + </tr> + <tr> + <td><code>"ZoomIn"</code> [6]</td> + <td>The <kbd>ZoomIn</kbd> key.</td> + <td></td> + <td></td> + <td><code>GDK_KEY_ZoomIn</code> (0x1008FF8B)<br> + <code>Qt::Key_ZoomIn</code> (0x010000F6)</td> + <td><code>KEYCODE_ZOOM_IN</code> (168)</td> + </tr> + <tr> + <td><code>"ZoomOut"</code> [6]</td> + <td>The <kbd>ZoomOut</kbd> key.</td> + <td></td> + <td></td> + <td><code>GDK_KEY_ZoomOut</code> (0x1008FF8C)<br> + <code>Qt::Key_ZoomOut</code> (0x010000F7)</td> + <td><code>KEYCODE_ZOOM_OUT</code> (169)</td> + </tr> + </tbody> +</table> + +<p>[1] In Google Chrome 52, the <kbd>Cancel</kbd> key incorrectly returns the key code <code>"Pause"</code>. This is fixed in Chrome 53. See <a href="https://bugs.chromium.org/p/chromium/issues/detail?id=612749">Chrome bug 612749</a> for details.</p> + +<p>[2] In Internet Explorer (tested on release 9 and 11) and Firefox 36 and earlier, the <kbd>Esc</kbd> key returns <code>"Esc"</code> instead of <code>"Escape"</code>.</p> + +<p>[3] Internet Explorer (tested on release 9 and 11) and Firefox 36 and earlier report <code>"Apps"</code> instead of <code>"ContextMenu"</code> for the context menu key.</p> + +<p>[4] The <kbd>Attn</kbd> key generates the key code <code>"Unidentified"</code> on Internet Explorer (tested on release 9 and 11). Firefox and Google Chrome report the same, unless the Japanese keyboard layout is in effect, in which case it generates <code>"KanaMode"</code> instead.</p> + +<p>[5] The <kbd>Finish</kbd> key gemerates the key code <code>"Unidentified"</code> on Internet Explorer (tested on release 9 and 11). Firefox reports the same, unless the Japanese keyboard layout is in effect, in which case it generates <code>"Katakana"</code> instead.</p> + +<p>[6] Firefox didn't support the <code>"ZoomIn"</code> and <code>"ZoomOut"</code> keys until Firefox 37.</p> + +<h2 id="Device_keys">Device keys</h2> + +<table class="standard-table"> + <thead> + <tr> + <th rowspan="2" scope="col" style="text-align: left;"><code>KeyboardEvent.key</code> Value</th> + <th rowspan="2" scope="col" style="text-align: left;">Description</th> + <th colspan="4" scope="col" style="text-align: center;">Virtual Keycode</th> + </tr> + <tr> + <th scope="col" style="text-align: left;">Windows</th> + <th scope="col" style="text-align: left;">Mac</th> + <th scope="col" style="text-align: left;">Linux</th> + <th scope="col" style="text-align: left;">Android</th> + </tr> + </thead> + <tbody> + <tr> + <td><code>"BrightnessDown"</code></td> + <td>The Brightness Down key. Typically used to reduce the brightness of the display.</td> + <td></td> + <td></td> + <td><code>GDK_KEY_MonBrightnessDown</code> (0x1008FF03)<br> + <code>Qt::Key_MonBrightnessDown</code> (0x010000B3)</td> + <td><code>KEYCODE_BRIGHTNESS_DOWN</code> (220)</td> + </tr> + <tr> + <td><code>"BrightnessUp"</code></td> + <td>The Brightness Up key. Typically increases the brightness of the display.</td> + <td></td> + <td></td> + <td><code>GDK_KEY_MonBrightnessUp</code> (0x1008FF02)<br> + <code>Qt::Key_MonBrightnessUp</code> (0x010000B2)</td> + <td><code>KEYCODE_BRIGHTNESS_UP</code> (221)</td> + </tr> + <tr> + <td><code>"Eject"</code></td> + <td>The <kbd>Eject</kbd> key. Ejects removable media (or toggles an optical storage device tray open and closed).</td> + <td></td> + <td></td> + <td><code>GDK_KEY_Eject</code> (0x1008FF2C)<br> + <code>Qt::Key_Eject</code> (0x010000B9)</td> + <td><code>KEYCODE_MEDIA_EJECT</code> (129)</td> + </tr> + <tr> + <td><code>"LogOff"</code> [2]</td> + <td>The <kbd>LogOff</kbd> key.</td> + <td></td> + <td></td> + <td><code>GDK_KEY_LogOff</code> (0x1008FF61)<br> + <code>Qt::Key_LogOff</code> (0x010000D9)</td> + <td></td> + </tr> + <tr> + <td><code>"Power"</code></td> + <td>The <kbd>Power</kbd> button or key, to toggle power on and off. + <div class="note">Not all systems pass this key through to to the user agent.</div> + </td> + <td></td> + <td></td> + <td></td> + <td><code>KEYCODE_POWER</code> (26)</td> + </tr> + <tr> + <td><code>"PowerOff"</code></td> + <td>The <kbd>PowerOff</kbd> or <kbd>PowerDown</kbd> key. Shuts off the system.</td> + <td></td> + <td></td> + <td><code>GDK_KEY_PowerDown</code> (0x1008FF21)<br> + <code>GDK_KEY_PowerOff</code> (0x1008FF2A)<br> + <code>Qt::Key_PowerDown</code> (0x0100010B)<br> + <code>Qt::Key_PowerOff</code> (0x010000B7)</td> + <td></td> + </tr> + <tr> + <td><code>"PrintScreen"</code></td> + <td>The <kbd>PrintScreen</kbd> or <kbd>PrtScr</kbd> key. Sometimes <kbd>SnapShot</kbd>. Captures the screen and prints it or saves it to disk.</td> + <td><code>VK_SNAPSHOT</code> (0x2C)</td> + <td></td> + <td><code>GDK_KEY_3270_PrintScreen</code> (0xFD1D)<br> + <code>GDK_KEY_Print</code> (0xFF61)<br> + <code>GDK_KEY_Sys_Req</code> (0xFF15)<br> + <code>Qt::Key_Print</code> (0x01000009)<br> + <code>Qt::Key_SysReq</code> (0x0100000A)</td> + <td><code>KEYCODE_SYSRQ</code> (120)</td> + </tr> + <tr> + <td><code>"Hibernate"</code> [2]</td> + <td>The <kbd>Hibernate</kbd> key. This saves the state of the computer to disk and then shuts down; the computer can be returned to its previous state by restoring the saved state information.</td> + <td></td> + <td></td> + <td><code>GDK_KEY_Hibernate</code> (0x1008FFA8)<br> + <code>Qt::Key_Hibernate</code> (0x01000108)</td> + <td></td> + </tr> + <tr> + <td><code>"Standby"</code> [1]</td> + <td>The <kbd>Standby</kbd> key; also known as <kbd>Suspend</kbd> or <kbd>Sleep</kbd>. This turns off the display and puts the computer in a low power consumption mode, without completely powering off.</td> + <td><code>VK_SLEEP</code> (0x5F)</td> + <td></td> + <td><code>GDK_KEY_Standby</code> (0x1008FF10)<br> + <code>GDK_KEY_Suspend</code> (0x1008FFA7)<br> + <code>GDK_KEY_Sleep</code> (0x1008FF2F)<br> + <code>Qt::Key_Standby</code> (0x01000093)<br> + <code>Qt::Key_Suspend</code> (0x0100010C)<br> + <code>Qt::Key_Sleep</code> (0x01020004)</td> + <td><code>KEYCODE_SLEEP</code> (223)</td> + </tr> + <tr> + <td><code>"WakeUp"</code> [2]</td> + <td>The <kbd>WakeUp</kbd> key; used to wake the computer from the hibernation or standby modes.</td> + <td></td> + <td></td> + <td><code>GDK_KEY_WakeUp</code> (0x1008FF2B)<br> + <code>Qt::Key_WakeUp</code> (0x010000B8)</td> + <td><code>KEYCODE_WAKEUP</code> (224)</td> + </tr> + </tbody> +</table> + +<p>[1] The <kbd>Standby</kbd> key is not supported by Internet Explorer (tested on release 9 and 11) and Firefox 36 and earlier, so it is reported as <code>"Unidentified"</code>.</p> + +<p>[2] Prior to Firefox 37, this key generated the value <code>"Unidentified"</code>.</p> + +<h2 id="IME_and_composition_keys">IME and composition keys</h2> + +<p>Keys used when using an Input Method Editor (IME) to input text which can't readily be entered by simple keypresses, such as text in languages such as those which have more graphemes than there are character entry keys on the keyboard; common examples include Chinese, Japanese, Korean, and Hindi.</p> + +<p>Some keys are common across multiple languages, while others exist only on keyboards targeting specific languages. In addition, not all keyboards have all of these keys.</p> + +<h4 id="Common_IME_keys">Common IME keys</h4> + +<table class="standard-table"> + <thead> + <tr> + <th rowspan="2" scope="col" style="text-align: left;"><code>KeyboardEvent.key</code> Value</th> + <th rowspan="2" scope="col" style="text-align: left;">Description</th> + <th colspan="4" scope="col" style="text-align: center;">Virtual Keycode</th> + </tr> + <tr> + <th scope="col" style="text-align: left;">Windows</th> + <th scope="col" style="text-align: left;">Mac</th> + <th scope="col" style="text-align: left;">Linux</th> + <th scope="col" style="text-align: left;">Android</th> + </tr> + </thead> + <tbody> + <tr> + <td><code>"AllCandidates"</code></td> + <td>The <kbd>All Candidates</kbd> key, which starts multi-candidate mode, in which multiple candidates are displayed for the ongoing input.</td> + <td></td> + <td></td> + <td><code>GDK_KEY_MultipleCandidate</code> (0xFF3D<br> + <code>Qt::Key_MultipleCandidate</code> (0x0100113D)</td> + <td></td> + </tr> + <tr> + <td><code>"Alphanumeric"</code></td> + <td>The <kbd>Alphanumeric</kbd> key.</td> + <td><code>VK_OEM_ATTN</code> (0xF0)</td> + <td></td> + <td><code>GDK_KEY_Eisu_Shift</code> (0xFF2F)<br> + <code>GDK_KEY_Eisu_toggle</code> (0xFF30)<br> + <code>Qt::Key_Eisu_Shift</code> (0x0100112f)<br> + <code>Qt::Key_Eisu_toggle</code> (0x01001130)</td> + <td></td> + </tr> + <tr> + <td><code>"CodeInput"</code></td> + <td>The <kbd>Code Input</kbd> key, which enables code input mode, which lets the user enter characters by typing their code points (their Unicode character numbers, typically).</td> + <td></td> + <td></td> + <td><code>GDK_KEY_Codeinput</code> (0xFF37)<br> + <code>Qt::Key_Codeinput</code> (0x01001137)</td> + <td></td> + </tr> + <tr> + <td><code>"Compose"</code></td> + <td>The <kbd>Compose</kbd> key.</td> + <td></td> + <td></td> + <td><code>GDK_KEY_Multi_key</code> (0xFF20) [1]<br> + <code>Qt::Key_Multi_key</code> (0x01001120)</td> + <td></td> + </tr> + <tr> + <td><code>"Convert"</code> [4]</td> + <td>The <kbd>Convert</kbd> key, which instructs the IME to convert the current input method sequence into the resulting character.</td> + <td><code>VK_CONVERT</code> (0x1C)</td> + <td></td> + <td><code>GDK_KEY_Henkan</code> (0xFF23)<br> + <code>Qt::Key_Henkan</code> (0x01001123)</td> + <td><code>KEYCODE_HENKAN</code> (214)</td> + </tr> + <tr> + <td><code>"Dead"</code></td> + <td>A dead "combining" key; that is, a key which is used in tandem with other keys to generate accented and other modified characters. If pressed by itself, it doesn't generate a character. If you wish to identify which specific dead key was pressed (in cases where more than one exists), you can do so by examining the {{domxref("KeyboardEvent")}}'s associated {{event("compositionupdate")}} event's {{domxref("CompositionEvent.data", "data")}} property.</td> + <td></td> + <td></td> + <td>See {{anch("Dead keycodes for Linux")}} below</td> + <td></td> + </tr> + <tr> + <td><code>"FinalMode"</code></td> + <td>The <kbd>Final</kbd> (Final Mode) key is used on some Asian keyboards to enter final mode when using IMEs.</td> + <td><code>VK_FINAL</code> (0x18)</td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>"GroupFirst"</code></td> + <td>Switches to the first character group on an <a href="https://en.wikipedia.org/wiki/ISO/IEC_9995">ISO/IEC 9995 keyboard</a>. Each key may have multiple groups of characters, each in its own column. Pressing this key instructs the device to interpret keypresses as coming from the first column on subsequent keystrokes.</td> + <td></td> + <td></td> + <td><code>GDK_KEY_ISO_First_Group</code> (0xFE0C)</td> + <td></td> + </tr> + <tr> + <td><code>"GroupLast"</code></td> + <td>Switches to the last character group on an <a href="https://en.wikipedia.org/wiki/ISO/IEC_9995">ISO/IEC 9995 keyboard</a>.</td> + <td></td> + <td></td> + <td><code>GDK_KEY_ISO_Last_Group</code> (0xFE0E)</td> + <td></td> + </tr> + <tr> + <td><code>"GroupNext"</code> [4]</td> + <td>Switches to the next character group on an <a href="https://en.wikipedia.org/wiki/ISO/IEC_9995">ISO/IEC 9995 keyboard</a>.</td> + <td></td> + <td></td> + <td><code>GDK_KEY_ISO_Next_Group</code> (0xFE08)</td> + <td><code>KEYCODE_LANGUAGE_SWITCH</code> (204)</td> + </tr> + <tr> + <td><code>"GroupPrevious"</code></td> + <td>Switches to the previous character group on an <a href="https://en.wikipedia.org/wiki/ISO/IEC_9995">ISO/IEC 9995 keyboard</a>.</td> + <td></td> + <td></td> + <td><code>GDK_KEY_ISO_Prev_Group</code> (0xFE0A)</td> + <td></td> + </tr> + <tr> + <td><code>"ModeChange"</code> [5]</td> + <td>The Mode Change key. Toggles or cycles among input modes of IMEs.</td> + <td><code>VK_MODECHANGE</code> (0x1F)</td> + <td></td> + <td><code>GDK_KEY_Mode_switch</code> (0xFF7E)<br> + <code>GDK_KEY_script_switch</code> (0xFF7E)<br> + <code>Qt::Key_Mode_switch</code> (0x0100117E)</td> + <td><code>KEYCODE_SWITCH_CHARSET</code> (95)</td> + </tr> + <tr> + <td><code>"NextCandidate"</code></td> + <td>The Next Candidate function key. Selects the next possible match for the ongoing input.</td> + <td></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>"NonConvert"</code> [2]</td> + <td>The <kbd>NonConvert</kbd> ("Don't convert") key. This accepts the current input method sequence without running conversion when using an IME.</td> + <td><code>VK_NONCONVERT</code> (0x1D)</td> + <td></td> + <td><code>GDK_KEY_Muhenkan</code> (0xFF22)<br> + <code>Qt::Key_Muhenkan</code> (0x01001122)<br> + </td> + <td><code>KEYCODE_MUHENKAN</code> (213)</td> + </tr> + <tr> + <td><code>"PreviousCandidate"</code></td> + <td>The Previous Candidate key. Selects the previous possible match for the ongoing input.</td> + <td></td> + <td></td> + <td><code>GDK_KEY_PreviousCandidate</code> (0xFF3E)<br> + <code>Qt::Key_PreviousCandidate</code> (0x0100113E)</td> + <td></td> + </tr> + <tr> + <td><code>"Process"</code> [3]</td> + <td>The <kbd>Process</kbd> key. Instructs the IME to process the conversion.</td> + <td><code>VK_PROCESSKEY</code> (0xE5)</td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>"SingleCandidate"</code> [4]</td> + <td>The Single Candidate key. Enables single candidate mode (as opposed to multi-candidate mode); in this mode, only one candidate is displayed at a time.</td> + <td></td> + <td></td> + <td><code>GDK_KEY_SingleCandidate</code> (0xFF3C)<br> + <code>Qt::Key_SingleCandidate</code> (0x0100113C)</td> + <td></td> + </tr> + </tbody> +</table> + +<p>[1] On the <em>X Window System</em>, the <kbd>Compose</kbd> key is called the <kbd>Multi</kbd> key.</p> + +<p>[2] The <kbd>NonConvert</kbd> key is reported as <code>"Nonconvert"</code> instead of the correct <code>"NonConvert"</code> by Internet Explorer (tested on release 9 and 11) and Firefox versions 36 and earlier.</p> + +<p>[3] The <kbd>Process</kbd> key currently returns <code>"Unidentified"</code> in Firefox and Internet Explorer. Google Chrome returns the value of the key as if IME were not in use.</p> + +<p>[4] Prior to Firefox 37, these keys were <code>"Unidentified"</code>.</p> + +<p>[5] Firefox generates the key value <code>"AltGraph"</code> instead of <code>"ModeChange"</code>.</p> + +<h3 id="Korean_keyboards_only">Korean keyboards only</h3> + +<p>These keys are only available on Korean keyboards. There are other keys defined by various platforms for Korean keyboards, but these are the most common and are the ones identified by the UI Events specification.</p> + +<table class="standard-table"> + <thead> + <tr> + <th rowspan="2" scope="col" style="text-align: left;"><code>KeyboardEvent.key</code> Value</th> + <th rowspan="2" scope="col" style="text-align: left;">Description</th> + <th colspan="4" scope="col" style="text-align: center;">Virtual Keycode</th> + </tr> + <tr> + <th scope="col" style="text-align: left;">Windows</th> + <th scope="col" style="text-align: left;">Mac</th> + <th scope="col" style="text-align: left;">Linux</th> + <th scope="col" style="text-align: left;">Android</th> + </tr> + <tr> + <td><code>"HangulMode"</code></td> + <td>The <kbd>Hangul</kbd> (Korean character set) mode key, which toggles between Hangul and English entry modes.</td> + <td><code>VK_HANGUL</code> (0x15) [1]</td> + <td></td> + <td><code>GDK_KEY_Hangul</code> (0xFF31)<br> + <code>Qt::Key_Hangul</code> (0x01001131)</td> + <td></td> + </tr> + <tr> + <td><code>"HanjaMode"</code></td> + <td>Selects the Hanja mode, for converting Hangul characters to the more specific Hanja characters.</td> + <td><code>VK_HANJA</code> (0x19) [1]</td> + <td></td> + <td><code>GDK_KEY_Hangul_Hanja</code> (0xFF34)<br> + <code>Qt::Key_Hangul_Hanja</code> (0x01001134)</td> + <td></td> + </tr> + <tr> + <td><code>"JunjaMode"</code></td> + <td>Selects the Junja mode, in which Korean is represented using single-byte Latin characters.</td> + <td><code>VK_JUNJA</code> (0x17)</td> + <td></td> + <td><code>GDK_KEY_Hangul_Jeonja</code> (0xFF38)<br> + <code>Qt::Key_Hangul_Jeonja</code> (0x01001138)</td> + <td></td> + </tr> + </thead> +</table> + +<p>[1] <code>VK_HANGUL</code> and <code>VK_KANA</code> share the same numeric key value on Windows, as do <code>VK_HANJA</code> and <code>VK_KANJI</code>.</p> + +<h3 id="Japanese_keyboards_only">Japanese keyboards only</h3> + +<p>These keys are only available on Japanese keyboards.</p> + +<table class="standard-table"> + <thead> + <tr> + <th rowspan="2" scope="col" style="text-align: left;"><code>KeyboardEvent.key</code> Value</th> + <th rowspan="2" scope="col" style="text-align: left;">Description</th> + <th colspan="4" scope="col" style="text-align: center;">Virtual Keycode</th> + </tr> + <tr> + <th scope="col" style="text-align: left;">Windows</th> + <th scope="col" style="text-align: left;">Mac</th> + <th scope="col" style="text-align: left;">Linux</th> + <th scope="col" style="text-align: left;">Android</th> + </tr> + <tr> + <td><code>"Eisu"</code> [1]</td> + <td>The <kbd>Eisu</kbd> key. This key's purpose is defined by the IME, but may be used to close the IME.</td> + <td></td> + <td><code>kVK_JIS_Eisu</code> (0x66)</td> + <td><code>GDK_KEY_Eisu_toggle</code> (0xFF2F)<br> + <code>Qt::Key_Eisu_toggle</code> (0x01001130)</td> + <td><code>KEYCODE_EISU</code> (212)</td> + </tr> + <tr> + <td><code>"Hankaku"</code> [3]</td> + <td>The <kbd>Hankaku</kbd> (half-width characters) key.</td> + <td><code>VK_OEM_AUTO</code> (0xF3)</td> + <td></td> + <td><code>GDK_KEY_Hankaku</code> (0xFF29)<br> + <code>Qt::Key_Hankaku</code> (0x01001129)</td> + <td></td> + </tr> + <tr> + <td><code>"Hiragana"</code></td> + <td>The <kbd>Hiragana</kbd> key; selects Kana characters mode.</td> + <td><code>VK_OEM_COPY</code> (0xF2)</td> + <td></td> + <td><code>GDK_KEY_Hiragana</code> (0xFF25)<br> + <code>Qt::Key_Hiragana</code> (0x01001125)</td> + <td></td> + </tr> + <tr> + <td><code>"HiraganaKatakana"</code> [6]</td> + <td>Toggles between the Hiragana and Katakana writing systems.</td> + <td></td> + <td></td> + <td><code>GDK_KEY_Hiragana_Katakana</code> (0xFF27)<br> + <code>Qt::Key_Hiragana_Katakana</code> (0x01001127)</td> + <td><code>KEYCODE_KATAKANA_HIRAGANA</code> (215)</td> + </tr> + <tr> + <td><code>"KanaMode"</code></td> + <td>The <kbd>Kana Mode</kbd> (Kana Lock) key.</td> + <td><code>VK_KANA</code> (0x15) [2]<br> + <code>VK_ATTN</code> (0xF6)</td> + <td></td> + <td><code>GDK_KEY_Kana_Lock</code> (0xFF2D)<br> + <code>GDK_KEY_Kana_Shift</code> (0xFF2E)<br> + <code>Qt::Key_Kana_Lock</code> (0x0100112D)<br> + <code>Qt::Key_Kana_Shift</code> (0x0100112E)</td> + <td></td> + </tr> + <tr> + <td><code>"KanjiMode"</code></td> + <td>The <kbd>Kanji Mode</kbd> key. Enables entering Japanese text using the ideographic characters of Chinese origin.</td> + <td><code>VK_KANJI</code> [2]</td> + <td><code>kVK_JIS_Kana</code> (0x68)</td> + <td><code>GDK_KEY_Kanji</code> (0xFF21)<br> + <code>Qt::Key_Kanji</code> (0x01001121)</td> + <td><code>KEYCODE_KANA</code> (218)</td> + </tr> + <tr> + <td><code>"Katakana"</code></td> + <td>The <kbd>Katakana</kbd> key.</td> + <td><code>VK_OEM_FINISH</code> (0xF1)</td> + <td></td> + <td><code>GDK_KEY_Katakana</code> (0xFF26)<br> + <code>Qt::Key_Katakana</code> (0x01001126)</td> + <td></td> + </tr> + <tr> + <td><code>"Romaji"</code> [5]</td> + <td>The <kbd>Romaji</kbd> key; selects the Roman character set.</td> + <td><code>VK_OEM_BACKTAB</code> (0xF5)</td> + <td></td> + <td><code>GDK_KEY_Romaji</code> (0xFF24)<br> + <code>Qt::Key_Romaji</code> (0x01001124)</td> + <td></td> + </tr> + <tr> + <td><code>"Zenkaku"</code> [4]</td> + <td>The <kbd>Zenkaku</kbd> (full width) characters key.</td> + <td><code>VK_OEM_ENLW</code> (0xF4)</td> + <td></td> + <td><code>GDK_KEY_Zenkaku</code> (0xFF28)<br> + <code>Qt::Key_Zenkaku</code> (0x01001128)</td> + <td></td> + </tr> + <tr> + <td><code>"ZenkakuHanaku"</code> [6]</td> + <td>The <kbd>Zenkaku/Hankaku</kbd> (full width/half width) toggle key.</td> + <td></td> + <td></td> + <td><code>GDK_KEY_Zenkaku_Hankaku</code> (0xFF2A)<br> + <code>Qt::Zenkaku_Hankaku</code> (0x0100112A)</td> + <td> + <p><code>KEYCODE_ZENKAKU_HANKAKU</code> (211)</p> + </td> + </tr> + </thead> +</table> + +<p>[1] Prior to Firefox 37, the <kbd>Eisu</kbd> key was mapped to <code>"RomanCharacters"</code> by mistake.</p> + +<p>[2] <code>VK_HANGUL</code> and <code>VK_KANA</code> share the same numeric key value on Windows, as do <code>VK_HANJA</code> and <code>VK_KANJI</code>.</p> + +<p>[3] Prior to Firefox 37, the <kbd>Hankaku</kbd> (half-width) key generated the key value <code>"HalfWidth"</code> on Firefox. Also, this key generates the value <code>"Unidentified"</code> on Internet Explorer (tested on release 9 and 11).</p> + +<p>[4] Internet Explorer (tested on release 9 and 11) reports <code>"Unidentified"</code> for the <kbd>Zenkaku</kbd> key; Firefox 36 and earlier identify this key as <code>"FullWidth"</code> on Japanese keyboard layouts and <code>"Unidentified"</code> on all other keyboard layouts. Firefox 37 and later, and all versions of Google Chrome, correctly return <code>"Zenkaku"</code>.</p> + +<p>[5] <code>"Unidentified"</code> in Internet Explorer (tested on release 9 and 11). Firefox 36 and earlier identify the <kbd>Romaji</kbd> key as <code>"RomanCharacters"</code> on Japanese keyboards and <code>"Unidentified"</code> for other keyboards; this is corrected to return <code>"Romaji"</code> in Firefox 37 and later.</p> + +<p>[6] This key is reported as <code>"Unidentified"</code> prior to Firefox 37.</p> + +<h3 id="Dead_keycodes_for_Linux">Dead keycodes for Linux</h3> + +<p>Linux generates accented characters using special <strong>dead keys</strong>; these are keys which are pressed in combination with character keys to generate accented forms of those characters. You can identify which specific dead key was used (if more than one exists) by examining the {{domxref("KeyboardEvent")}}'s associated {{event("compositionupdate")}} event's {{domxref("CompositionEvent.data", "data")}} property.</p> + +<p>You can find a table of the dead keys and the characters they can be used with to generate accented or otherwise special characters on Linux using GTK</p> + +<p>The value of {{domxref("CompositionEvent.data", "data")}} will be one of the following:</p> + +<table class="standard-table"> + <tbody> + <tr> + <td><strong><code>CompositionEvent.data</code></strong> value</td> + <td>Symbol</td> + <td>Comments</td> + </tr> + <tr> + <td><code>GDK_KEY_dead_grave</code> (0xFE50)<br> + <code>Qt::Key_Dead_Grave</code> (0x01001250)</td> + <td>`</td> + <td></td> + </tr> + <tr> + <td><code>GDK_KEY_dead_acute</code> (0xFE51)<br> + <code>Qt::Key_Dead_Acute</code> (0x01001251)</td> + <td>´</td> + <td></td> + </tr> + <tr> + <td><code>GDK_KEY_dead_circumflex</code> (0xFE52)<br> + <code>Qt::Key_Dead_Circumflex</code> (0x01001252)</td> + <td>ˆ</td> + <td></td> + </tr> + <tr> + <td><code>GDK_KEY_dead_tilde</code> (0xFE53)<br> + <code>Qt::Key_Dead_Tilde</code> (0x01001253)</td> + <td>˜</td> + <td></td> + </tr> + <tr> + <td><code>GDK_KEY_dead_perispomeni</code> (0xFE53)</td> + <td> ͂</td> + <td></td> + </tr> + <tr> + <td><code>GDK_KEY_dead_macron</code> (0xFE54)<br> + <code>Qt::Key_Dead_Macron</code> (0x01001254)</td> + <td>¯</td> + <td></td> + </tr> + <tr> + <td><code>GDK_KEY_dead_breve</code> (0xFE55)<br> + <code>Qt::Key_Dead_Breve</code> (0x01001255)</td> + <td>˘</td> + <td></td> + </tr> + <tr> + <td><code>GDK_KEY_dead_abovedot</code> (0xFE56)<br> + <code>Qt::Key_Dead_Abovedot</code> (0x01001256)</td> + <td>˙</td> + <td></td> + </tr> + <tr> + <td><code>GDK_KEY_dead_diaeresis</code> (0xFE57)<br> + <code>Qt::Key_Dead_Diaeresis</code> (0x01001257)</td> + <td>¨</td> + <td>Also called an umlaut.</td> + </tr> + <tr> + <td><code>GDK_KEY_dead_abovering</code> (0xFE58)<br> + <code>Qt::Key_Dead_Abovering</code> (0x01001258)</td> + <td>˚</td> + <td></td> + </tr> + <tr> + <td><code>GDK_KEY_dead_doubleacute</code> (0xFE59)<br> + <code>Qt::Key_Dead_Doubleacute</code> (0x01001259)</td> + <td>˝</td> + <td></td> + </tr> + <tr> + <td><code>GDK_KEY_dead_caron</code> (0xFE5A)<br> + <code>Qt::Key_Dead_Caron</code> (0x0100125A)</td> + <td>ˇ</td> + <td>Also called a háček; used in Czech among other languages.</td> + </tr> + <tr> + <td><code>GDK_KEY_dead_cedilla</code> (0xFE5B)<br> + <code>Qt::Key_Dead_Cedilla</code> (0x0100125B)</td> + <td>¸</td> + <td></td> + </tr> + <tr> + <td><code>GDK_KEY_dead_ogonek</code> (0xFE5C)<br> + <code>Qt::Key_Dead_Ogonek</code> (0x0100125C)</td> + <td>˛</td> + <td>Also called a nosinė; used in Polish and Old Irish.</td> + </tr> + <tr> + <td><code>GDK_KEY_dead_iota</code> (0xFE5D)<br> + <code>Qt::Key_Dead_Iota</code> (0x0100125D)</td> + <td> ͅ</td> + <td>Iota subscript.</td> + </tr> + <tr> + <td><code>GDK_KEY_dead_voiced_sound</code> (0xFE5E)<br> + <code>Qt::Key_Dead_Voiced_Sound</code> (0x0100125E)</td> + <td>゙</td> + <td></td> + </tr> + <tr> + <td><code>GDK_KEY_dead_semivoiced_sound</code> (0xFE5F)<br> + <code>Qt::Key_Dead_Semivoiced_Sound</code> (0x0100125F)</td> + <td>゚</td> + <td></td> + </tr> + <tr> + <td><code>GDK_KEY_dead_belowdot</code> (0xFE60)<br> + <code>Qt::Key_Dead_Belowdot</code> (0x01001260)</td> + <td>̣̣</td> + <td></td> + </tr> + <tr> + <td><code>GDK_KEY_dead_hook</code> (0xFE61)<br> + <code>Qt::Key_Dead_Hook</code> (0x01001261)</td> + <td> ̡</td> + <td></td> + </tr> + <tr> + <td><code>GDK_KEY_dead_horn</code> (0xFE62)<br> + <code>Qt::Key_Dead_Horn</code> (0x01001262)</td> + <td> ̛</td> + <td></td> + </tr> + <tr> + <td><code>GDK_KEY_dead_stroke</code> (0xFE63)</td> + <td> ̶̶</td> + <td></td> + </tr> + <tr> + <td><code>GDK_KEY_dead_abovecomma</code> (0xFE64)</td> + <td> ̓̓</td> + <td></td> + </tr> + <tr> + <td><code>GDK_KEY_dead_psili</code> (0xFE64)</td> + <td> ᾿</td> + <td></td> + </tr> + <tr> + <td><code>GDK_KEY_dead_abovereversedcomma</code> (0xFE65)</td> + <td>ʽ</td> + <td></td> + </tr> + <tr> + <td><code>GDK_KEY_dead_dasia</code> (0xFE65)</td> + <td>῾</td> + <td></td> + </tr> + <tr> + <td><code>GDK_KEY_dead_doublegrave</code> (0xFE66)</td> + <td> ̏</td> + <td></td> + </tr> + <tr> + <td><code>GDK_KEY_dead_belowring</code> (0xFE67)</td> + <td>˳</td> + <td></td> + </tr> + <tr> + <td><code>GDK_KEY_dead_belowmacron</code> (0xFE68)</td> + <td> ̱</td> + <td></td> + </tr> + <tr> + <td><code>GDK_KEY_dead_belowcircumflex</code> (0xFE69)</td> + <td>ꞈ</td> + <td></td> + </tr> + <tr> + <td><code>GDK_KEY_dead_belowtilde</code> (0xFE6A)</td> + <td>̰</td> + <td></td> + </tr> + <tr> + <td><code>GDK_KEY_dead_belowbreve</code> (0xFE6B)</td> + <td>̮</td> + <td></td> + </tr> + <tr> + <td><code>GDK_KEY_dead_belowdiaeresis</code> (0xFE6C)</td> + <td> ̤</td> + <td></td> + </tr> + <tr> + <td><code>GDK_KEY_dead_invertedbreve</code> (0xFE6D)</td> + <td>̯</td> + <td></td> + </tr> + <tr> + <td><code>GDK_KEY_dead_belowcomma</code> (0xFE6E)</td> + <td>̦</td> + <td></td> + </tr> + <tr> + <td><code>GDK_KEY_dead_currency</code> (0xFE6F)</td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>GDK_KEY_dead_a</code> (0xFE80)</td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>GDK_KEY_dead_A</code> (0xFE81)</td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>GDK_KEY_dead_e</code> (0xFE82)</td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>GDK_KEY_dead_E</code> (0xFE83)</td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>GDK_KEY_dead_i</code> (0xFE84)</td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>GDK_KEY_dead_I</code> (0xFE85)</td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>GDK_KEY_dead_o</code> (0xFE86)</td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>GDK_KEY_dead_O</code> (0xFE87)</td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>GDK_KEY_dead_u</code> (0xFE88)</td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>GDK_KEY_dead_U</code> (0xFE89)</td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>GDK_KEY_dead_small_schwa</code> (0xFE8A)</td> + <td>ə</td> + <td></td> + </tr> + <tr> + <td><code>GDK_KEY_dead_capital_schwa</code> (0xFE8B)</td> + <td>Ə</td> + <td></td> + </tr> + <tr> + <td><code>GDK_KEY_dead_greek</code> (0xFE8C)</td> + <td></td> + <td></td> + </tr> + </tbody> +</table> + +<h2 id="Function_keys">Function keys</h2> + +<p>While various platforms support different numbers of the general-purpose function keys, such as <kbd>F1</kbd>-<kbd>F12</kbd> (or <kbd>F1</kbd>-<kbd>F10</kbd>, or <kbd>F1</kbd>-<kbd>F15</kbd>, or...), the first few are specifically defined as follows. If more function keys are available, their names continue the pattern here by continuing to increment the numeric portion of each key's name, so that, for example, <code>"F24"</code> is a valid key value.</p> + +<table class="standard-table"> + <thead> + <tr> + <th rowspan="2" scope="col" style="text-align: left;"><code>KeyboardEvent.key</code> value</th> + <th rowspan="2" scope="col" style="text-align: left;">Description</th> + <th colspan="4" scope="col" style="text-align: center;">Virtual Keycode</th> + </tr> + <tr> + <th scope="col" style="text-align: left;">Windows</th> + <th scope="col" style="text-align: left;">Mac</th> + <th scope="col" style="text-align: left;">Linux</th> + <th scope="col" style="text-align: left;">Android</th> + </tr> + <tr> + <td><code>"F1"</code></td> + <td>The first general-purpose function key, <kbd>F1</kbd>.</td> + <td><code>VK_F1</code> (0x70)</td> + <td><code>kVK_F1</code> (0x7A)</td> + <td><code>GDK_KEY_F1</code> (0xFFBE)<br> + <code>GDK_KEY_KP_F1</code> (0xFF91)<br> + <code>Qt::Key_F1</code> (0x01000030)</td> + <td><code>KEYCODE_F1</code> (131)</td> + </tr> + <tr> + <td><code>"F2"</code></td> + <td>The <kbd>F2</kbd> key.</td> + <td><code>VK_F2</code> (0x71)</td> + <td><code>kVK_F2</code> (0x78)</td> + <td><code>GDK_KEY_F2</code> (0xFFBF)<br> + <code>GDK_KEY_KP_F2</code> (0xFF92)<br> + <code>Qt::Key_F2</code> (0x01000031)</td> + <td><code>KEYCODE_F2</code> (132)</td> + </tr> + <tr> + <td><code>"F3"</code></td> + <td>The <kbd>F3</kbd> key.</td> + <td><code>VK_F3</code> (0x72)</td> + <td><code>kVK_F3</code> (0x63)</td> + <td><code>GDK_KEY_F3</code> (0xFFC0)<br> + <code>GDK_KEY_KP_F3</code> (0xFF93)<br> + <code>Qt::Key_F3</code> (0x01000032)</td> + <td><code>KEYCODE_F3</code> (133)</td> + </tr> + <tr> + <td><code>"F4"</code></td> + <td>The <kbd>F4</kbd> key.</td> + <td><code>VK_F4</code> (0x73)</td> + <td><code>kVK_F4</code> (0x76)</td> + <td><code>GDK_KEY_F4</code> (0xFFC1)<br> + <code>GDK_KEY_KP_F4</code> (0xFF94)<br> + <code>Qt::Key_F4</code> (0x01000033)</td> + <td><code>KEYCODE_F4</code> (134)</td> + </tr> + <tr> + <td><code>"F5"</code></td> + <td>The <kbd>F5</kbd> key.</td> + <td><code>VK_F5</code> (0x74)</td> + <td><code>kVK_F5</code> (0x60)</td> + <td><code>GDK_KEY_F5</code> (0xFFC2)<br> + <code>Qt::Key_F5</code> (0x01000034)</td> + <td><code>KEYCODE_F5</code> (135)</td> + </tr> + <tr> + <td><code>"F6"</code></td> + <td>The <kbd>F6</kbd> key.</td> + <td><code>VK_F6</code> (0x75)</td> + <td><code>kVK_F6</code> (0x61)</td> + <td><code>GDK_KEY_F6</code> (0xFFC3)<br> + <code>Qt::Key_F6</code> (0x01000035)</td> + <td><code>KEYCODE_F6</code> (136)</td> + </tr> + <tr> + <td><code>"F7"</code></td> + <td>The <kbd>F7</kbd> key.</td> + <td><code>VK_F7</code> (0x76)</td> + <td><code>kVK_F7</code> (0x62)</td> + <td><code>GDK_KEY_F7</code> (0xFFC4)<br> + <code>Qt::Key_F7</code> (0x01000036)</td> + <td><code>KEYCODE_F7</code> (137)</td> + </tr> + <tr> + <td><code>"F8"</code></td> + <td>The <kbd>F8</kbd> key.</td> + <td><code>VK_F8</code> (0x77)</td> + <td><code>kVK_F8</code> (0x64)</td> + <td><code>GDK_KEY_F8</code> (0xFFC5)<br> + <code>Qt::Key_F8</code> (0x01000037)</td> + <td><code>KEYCODE_F8</code> (138)</td> + </tr> + <tr> + <td><code>"F9"</code></td> + <td>The <kbd>F9</kbd> key.</td> + <td><code>VK_F9</code> (0x78)</td> + <td><code>kVK_F9</code> (0x65)</td> + <td><code>GDK_KEY_F9</code> (0xFFC6)<br> + <code>Qt::Key_F9</code> (0x01000038)</td> + <td><code>KEYCODE_F9</code> (139)</td> + </tr> + <tr> + <td><code>"F10"</code></td> + <td>The <kbd>F10</kbd> key.</td> + <td><code>VK_F10</code> (0x79)</td> + <td><code>kVK_F10</code> (0x6D)</td> + <td><code>GDK_KEY_F10</code> (0xFFC7)<br> + <code>Qt::Key_F10</code> (0x01000039)</td> + <td><code>KEYCODE_F10</code> (140)</td> + </tr> + <tr> + <td><code>"F11"</code></td> + <td>The <kbd>F11</kbd> key.</td> + <td><code>VK_F11</code> (0x7A)</td> + <td><code>kVK_F11</code> (0x67)</td> + <td><code>GDK_KEY_F11</code> (0xFFC8)<br> + <code>Qt::Key_F11</code> (0x0100003A)</td> + <td><code>KEYCODE_F11</code> (141)</td> + </tr> + <tr> + <td><code>"F12"</code></td> + <td>The <kbd>F12</kbd> key.</td> + <td><code>VK_F12</code> (0x7B)</td> + <td><code>kVK_F12</code> (0x6F)</td> + <td><code>GDK_KEY_F12</code> (0xFFC9)<br> + <code>Qt::Key_F12</code> (0x0100003B)</td> + <td><code>KEYCODE_F12</code> (142)</td> + </tr> + <tr> + <td><code>"F13"</code></td> + <td>The <kbd>F13</kbd> key.</td> + <td><code>VK_F13</code> (0x7C)</td> + <td><code>kVK_F13</code> (0x69)</td> + <td><code>GDK_KEY_F13</code> (0xFFCA)<br> + <code>Qt::Key_F13</code> (0x0100003C)</td> + <td><code>KEYCODE_F13</code></td> + </tr> + <tr> + <td><code>"F14"</code></td> + <td>The <kbd>F14</kbd> key.</td> + <td><code>VK_F14</code> (0x7D)</td> + <td><code>kVK_F14</code> (0x6B)</td> + <td><code>GDK_KEY_F14</code> (0xFFCB)<br> + <code>Qt::Key_F1</code>4 (0x0100003D)</td> + <td><code>KEYCODE_F14</code></td> + </tr> + <tr> + <td><code>"F15"</code></td> + <td>The <kbd>F15</kbd> key.</td> + <td><code>VK_F15</code> (0x7E)</td> + <td><code>kVK_F15</code> (0x71)</td> + <td><code>GDK_KEY_F15</code> (0xFFCC)<br> + <code>Qt::Key_F1</code>5 (0x0100003E)</td> + <td><code>KEYCODE_F15</code></td> + </tr> + <tr> + <td><code>"F16"</code></td> + <td>The <kbd>F16</kbd> key.</td> + <td><code>VK_F16</code> (0x7F)</td> + <td><code>kVK_F16</code> (0x6A)</td> + <td><code>GDK_KEY_F16</code> (0xFFCD)<br> + <code>Qt::Key_F1</code>6 (0x0100003F)</td> + <td><code>KEYCODE_F16</code></td> + </tr> + <tr> + <td><code>"F17"</code></td> + <td>The <kbd>F17</kbd> key.</td> + <td><code>VK_F17</code> (0x80)</td> + <td><code>kVK_F17</code> (0x40)</td> + <td><code>GDK_KEY_F17</code> (0xFFCE)<br> + <code>Qt::Key_F1</code>7 (0x01000040)</td> + <td><code>KEYCODE_F17</code></td> + </tr> + <tr> + <td><code>"F18"</code></td> + <td>The <kbd>F18</kbd> key.</td> + <td><code>VK_F18</code> (0x81)</td> + <td><code>kVK_F18</code> (0x4F)</td> + <td><code>GDK_KEY_F18</code> (0xFFCF)<br> + <code>Qt::Key_F1</code>8 (0x01000041)</td> + <td><code>KEYCODE_F18</code></td> + </tr> + <tr> + <td><code>"F19"</code></td> + <td>The <kbd>F19</kbd> key.</td> + <td><code>VK_F19</code> (0x82)</td> + <td><code>kVK_F19</code> (0x50)</td> + <td><code>GDK_KEY_F19</code> (0xFFD0)<br> + <code>Qt::Key_F1</code>9 (0x01000042)</td> + <td><code>KEYCODE_F19</code></td> + </tr> + <tr> + <td><code>"F20"</code></td> + <td>The <kbd>F20</kbd> key.</td> + <td><code>VK_F20</code> (0x83)</td> + <td><code>kVK_F20</code> (0x5A)</td> + <td><code>GDK_KEY_F20</code> (0xFFD1)<br> + <code>Qt::Key_F20</code> (0x01000043)</td> + <td><code>KEYCODE_F20</code></td> + </tr> + <tr> + <td><code>"Soft1"</code></td> + <td>The first general-purpose virtual function key.</td> + <td></td> + <td></td> + <td><code>Qt::Key_Context1</code> (0x01100000)</td> + <td></td> + </tr> + <tr> + <td><code>"Soft2"</code></td> + <td>The second general-purpose virtual function key.</td> + <td></td> + <td></td> + <td><code>Qt::Key_Context2</code> (0x01100001)</td> + <td></td> + </tr> + <tr> + <td><code>"Soft3"</code></td> + <td>The third general-purpose virtual function key.</td> + <td></td> + <td></td> + <td><code>Qt::Key_Context3</code> (0x01100002)</td> + <td></td> + </tr> + <tr> + <td><code>"Soft4"</code></td> + <td>The fourth general-purpose virtual function key.</td> + <td></td> + <td></td> + <td><code>Qt::Key_Context4</code> (0x01100003)</td> + <td></td> + </tr> + </thead> +</table> + +<h2 id="Phone_keys">Phone keys</h2> + +<p>These keys represent buttons which commonly exist on modern smartphones.</p> + +<table class="standard-table"> + <thead> + <tr> + <th rowspan="2" scope="col" style="text-align: left;"><code>KeyboardEvent.key</code> Value</th> + <th rowspan="2" scope="col" style="text-align: left;">Description</th> + <th colspan="4" scope="col" style="text-align: center;">Virtual Keycode</th> + </tr> + <tr> + <th scope="col" style="text-align: left;">Windows</th> + <th scope="col" style="text-align: left;">Mac</th> + <th scope="col" style="text-align: left;">Linux</th> + <th scope="col" style="text-align: left;">Android</th> + </tr> + <tr> + <td><code>"AppSwitch"</code></td> + <td>Presents a list of recently-used applications which lets the user change apps quickly.</td> + <td></td> + <td></td> + <td></td> + <td><code>KEYCODE_APP_SWITCH</code> (181)</td> + </tr> + <tr> + <td><code>"Call"</code></td> + <td>The <kbd>Call</kbd> key; dials the number which has been entered.</td> + <td></td> + <td></td> + <td><code>Qt::Key_Call</code> (0x01100004)</td> + <td><code>KEYCODE_CALL</code> (5)</td> + </tr> + <tr> + <td><code>"Camera"</code></td> + <td>The <kbd>Camera</kbd> key; activates the camera.</td> + <td></td> + <td></td> + <td><code>Qt::Key_Camera</code> (0x01100020)</td> + <td><code>KEYCODE_CAMERA</code> (27)</td> + </tr> + <tr> + <td><code>"CameraFocus"</code></td> + <td>The <kbd>Focus</kbd> key; focuses the camera.</td> + <td></td> + <td></td> + <td><code>Qt::Key_CameraFocus</code> (0x01100021)</td> + <td><code>KEYCODE_FOCUS</code> (80)</td> + </tr> + <tr> + <td><code>"EndCall"</code></td> + <td>The <kbd>End Call</kbd> or <kbd>Hang Up</kbd> button.</td> + <td></td> + <td></td> + <td><code>Qt::Key_Hangup</code> (0x01100005)</td> + <td><code>KEYCODE_ENDCALL</code> (6)</td> + </tr> + <tr> + <td><code>"GoBack"</code></td> + <td>The <kbd>Back</kbd> button.</td> + <td></td> + <td></td> + <td></td> + <td><code>KEYCODE_BACK</code> (4)</td> + </tr> + <tr> + <td><code>"GoHome"</code> [1]</td> + <td>The <kbd>Home</kbd> button, which takes the user to the phone's main screen (usually an application launcher).</td> + <td></td> + <td></td> + <td></td> + <td><code>KEYCODE_HOME</code> (3)</td> + </tr> + <tr> + <td><code>"HeadsetHook"</code></td> + <td>The <kbd>Headset Hook</kbd> key. This is typically actually a button on the headset which is used to hang up calls and play or pause media.</td> + <td></td> + <td></td> + <td><code>Qt::Key_ToggleCallHangup</code> (0x01100007)</td> + <td><code>KEYCODE_HEADSETHOOK</code> (79)</td> + </tr> + <tr> + <td><code>"LastNumberRedial"</code></td> + <td>The <kbd>Redial</kbd> button, which redials the last-called number.</td> + <td></td> + <td></td> + <td><code>Qt::Key_LastNumberRedial</code> (0x01100009)</td> + <td></td> + </tr> + <tr> + <td><code>"Notification"</code></td> + <td>The <kbd>Notification</kbd> key.</td> + <td></td> + <td></td> + <td></td> + <td><code>KEYCODE_NOTIFICATION</code> (83)</td> + </tr> + <tr> + <td><code>"MannerMode"</code></td> + <td>A button which cycles among the notification modes: silent, vibrate, ring, and so forth.</td> + <td></td> + <td></td> + <td></td> + <td><code>KEYCODE_MANNER_MODE</code> (205)</td> + </tr> + <tr> + <td><code>"VoiceDial"</code></td> + <td>The <kbd>Voice Dial</kbd> key. Initiates voice dialing.</td> + <td></td> + <td></td> + <td><code>Qt::Key_VoiceDial</code> (0x01100008)</td> + <td><code>KEYCODE_VOICE_ASSIST</code> (231)</td> + </tr> + </thead> +</table> + +<p>[1] Prior to Firefox 37, the Home button generated a key code of <code>"Exit"</code>. Starting in Firefox 37, the button generates the key code <code>"MozHomeScreen"</code>.</p> + +<h2 id="Multimedia_keys">Multimedia keys</h2> + +<p>The multimedia keys are extra buttons or keys for controlling media devices, found on some keyboards.</p> + +<table class="standard-table"> + <thead> + <tr> + <th rowspan="2" scope="col" style="text-align: left;"><code>KeyboardEvent.key</code> Value</th> + <th rowspan="2" scope="col" style="text-align: left;">Description</th> + <th colspan="4" scope="col" style="text-align: center;">Virtual Keycode</th> + </tr> + <tr> + <th scope="col" style="text-align: left;">Windows</th> + <th scope="col" style="text-align: left;">Mac</th> + <th scope="col" style="text-align: left;">Linux</th> + <th scope="col" style="text-align: left;">Android</th> + </tr> + <tr> + <td><code>"ChannelDown"</code></td> + <td>Switches to the previous channel.</td> + <td><code>APPCOMMAND_MEDIA_CHANNEL_DOWN</code></td> + <td></td> + <td><code>Qt::Key_ChannelDown</code> (0x01000119)</td> + <td><code>KEYCODE_CHANNEL_DOWN</code> (167)</td> + </tr> + <tr> + <td><code>"ChannelUp"</code></td> + <td>Switches to the next channel.</td> + <td><code>APPCOMMAND_MEDIA_CHANNEL_UP</code></td> + <td></td> + <td><code>Qt::Key_ChannelUp</code> (0x01000118)</td> + <td><code>KEYCODE_CHANNEL_UP</code> (166)</td> + </tr> + <tr> + <td><code>"MediaFastForward"</code> [2]</td> + <td>Starts, continues, or increases the speed of fast forwarding the media.</td> + <td><code>APPCOMMAND_MEDIA_FAST_FORWARD</code></td> + <td></td> + <td><code>GDK_KEY_AudioForward (0x1008FF97)<br> + Qt:Key_AudioForward</code> (0x01000102)</td> + <td><code>KEYCODE_MEDIA_FAST_FORWARD</code> (90)</td> + </tr> + <tr> + <td><code>"MediaPause"</code></td> + <td>Pauses the currently playing media. Some older applications use simply "Pause" but this is not correct.</td> + <td><code>APPCOMMAND_MEDIA_PAUSE</code></td> + <td></td> + <td><code>GDK_KEY_AudioPause</code> (0x1008FF31)<br> + <code>Qt::Key_MediaPause</code> (0x1000085)</td> + <td><code>KEYCODE_MEDIA_PAUSE</code> (127)</td> + </tr> + <tr> + <td><code>"MediaPlay"</code></td> + <td>Starts or continues playing media at normal speed, if not already doing so. Has no effect otherwise.</td> + <td><code>APPCOMMAND_MEDIA_PLAY</code></td> + <td></td> + <td><code>GDK_KEY_AudioPlay</code> (0x1008FF14)</td> + <td><code>KEYCODE_MEDIA_PLAY</code><code> (126)</code></td> + </tr> + <tr> + <td><code>"MediaPlayPause"</code></td> + <td>Toggles between playing and pausing the current media.</td> + <td><code>VK_MEDIA_PLAY_PAUSE</code> (0xB3)<br> + <code>APPCOMMAND_MEDIA_PLAY_PAUSE</code></td> + <td></td> + <td><code>Qt::Key_MediaTogglePlayPause</code> (0x1000086)</td> + <td><code>KEYCODE_MEDIA_PLAY_PAUSE</code> (85)</td> + </tr> + <tr> + <td><code>"MediaRecord"</code></td> + <td>Starts or resumes recording media.</td> + <td><code>APPCOMMAND_MEDIA_RECORD</code></td> + <td></td> + <td><code>GDK_KEY_AudioRecord</code> (0x1008FF1C)<br> + <code>Qt::Key_MediaRecord</code> (0x01000084)</td> + <td><code>KEYCODE_MEDIA_RECORD</code><code> (130)</code></td> + </tr> + <tr> + <td><code>"MediaRewind"</code></td> + <td>Starts, continues, or increases the speed of rewinding the media.</td> + <td><code>APPCOMMAND_MEDIA_REWIND</code></td> + <td></td> + <td><code>GDK_KEY_AudioRewind</code> (0x1008FF3E)<br> + <code>Qt::Key_AudioRewind</code> (0x010000C5)</td> + <td><code>KEYCODE_MEDIA_REWIND</code><code> (89)</code></td> + </tr> + <tr> + <td><code>"MediaStop"</code></td> + <td>Stops the current media activity (such as playing, recording, pausing, forwarding, or rewinding). Has no effect if the media is currently stopped already.</td> + <td><code>VK_MEDIA_STOP</code> (0xB2)<br> + <code>APPCOMMAND_MEDIA_STOP</code></td> + <td></td> + <td><code>GDK_KEY_AudioStop</code> (0x1008FF15)<br> + <code>Qt::Key_MediaStop</code> (0x01000081)</td> + <td><code>KEYCODE_MEDIA_STOP</code> (86)</td> + </tr> + <tr> + <td><code>"MediaTrackNext"</code> [1]</td> + <td>Seeks to the next media or program track.</td> + <td><code>VK_MEDIA_NEXT_TRACK</code> (0xB0)<br> + <code>APPCOMMAND_MEDIA_NEXTTRACK</code></td> + <td></td> + <td><code>GDK_KEY_AudioNext</code> (0x1008FF17)<br> + <code>Qt::Key_MediaNext</code> (0x01000083)</td> + <td><code>KEYCODE_MEDIA_NEXT</code> (87)</td> + </tr> + <tr> + <td><code>"MediaTrackPrevious"</code> [1]</td> + <td>Seeks to the previous media or program track.</td> + <td><code>VK_MEDIA_PREV_TRACK</code> (0xB1)<br> + <code>APPCOMMAND_MEDIA_PREVIOUSTRACK</code></td> + <td></td> + <td><code>GDK_KEY_AudioPrev</code> (0x1008FF16)<br> + <code>Qt::Key_MediaPrevious</code> (0x01000082)</td> + <td><code>KEYCODE_MEDIA_PREVIOUS</code> (88)</td> + </tr> + </thead> +</table> + +<p>[1] Internet Explorer, Edge, and Firefox (36 and earlier) use <code>"MediaNextTrack"</code> and <code>"MediaPreviousTrack"</code> instead of <code>"MediaTrackNext"</code> and <code>"MediaTrackPrevious"</code>.</p> + +<p>[2] Prior to Firefox 37, Firefox generated the key code <code>"FastFwd"</code> on some platforms and <code>"Unidentified"</code> on others instead of <code>"MediaFastForward"</code>.</p> + +<h2 id="Audio_control_keys">Audio control keys</h2> + +<p>These media keys are used specifically for controlling audio.</p> + +<table class="standard-table"> + <thead> + <tr> + <th rowspan="2" scope="col" style="text-align: left;"><code>KeyboardEvent.key</code> Value</th> + <th rowspan="2" scope="col" style="text-align: left;">Description</th> + <th colspan="4" scope="col" style="text-align: center;">Virtual Keycode</th> + </tr> + <tr> + <th scope="col" style="text-align: left;">Windows</th> + <th scope="col" style="text-align: left;">Mac</th> + <th scope="col" style="text-align: left;">Linux</th> + <th scope="col" style="text-align: left;">Android</th> + </tr> + <tr> + <td><code>"AudioBalanceLeft"</code></td> + <td>Adjusts audio balance toward the left.</td> + <td><code>VK_AUDIO_BALANCE_LEFT</code></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>"AudioBalanceRight"</code></td> + <td>Adjusts audio balance twoard the right.</td> + <td><code>VK_AUDIO_BALANCE_RIGHT</code></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>"AudioBassDown"</code></td> + <td>Decreases the amount of bass.</td> + <td><code>APPCOMMAND_BASS_DOWN</code></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>"AudioBassBoostDown"</code></td> + <td>Reduces bass boosting or cycles downward through bass boost modes or states.</td> + <td><code>VK_BASS_BOOST_DOWN</code></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>"AudioBassBoostToggle"</code></td> + <td>Toggles bass boosting on and off.</td> + <td><code>APPCOMMAND_BASS_BOOST</code></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>"AudioBassBoostUp"</code></td> + <td>Increases the amoung of bass boosting, or cycles upward through a set of bass boost modes or states.</td> + <td><code>VK_BASS_BOOST_UP</code></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>"AudioBassUp"</code></td> + <td>Increases the amount of bass.</td> + <td><code>APPCOMMAND_BASS_UP</code></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>"AudioFaderFront"</code></td> + <td>Adjusts the audio fader toward the front.</td> + <td><code>VK_FADER_FRONT</code></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>"AudioFaderRear"</code></td> + <td>Adjustts the audio fader toward the rear.</td> + <td><code>VK_FADER_REAR</code></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>"AudioSurroundModeNext"</code></td> + <td>Selects the next available surround sound mode.</td> + <td><code>VK_SURROUND_MODE_NEXT</code></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>"AudioTrebleDown"</code></td> + <td>Decreases the amount of treble.</td> + <td><code>APPCOMMAND_TREBLE_DOWN</code></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>"AudioTrebleUp"</code></td> + <td>Increases the amount of treble.</td> + <td><code>APPCOMMAND_TREBLE_UP</code></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>"AudioVolumeDown" [1]</code></td> + <td>Decreases the audio volume.</td> + <td><code>VK_VOLUME_DOWN</code> (0xAE)<br> + <code>APPCOMMAND_VOLUME_DOWN</code></td> + <td><code>kVK_VolumeDown</code> (0x49)</td> + <td><code>GDK_KEY_AudioLowerVolume</code> (0x1008FF11)<br> + <code>Qt::Key_VolumeDown</code> (0x01000070)</td> + <td><code>KEYCODE_VOLUME_DOWN</code> (25)</td> + </tr> + <tr> + <td><code>"AudioVolumeMute" [1]</code></td> + <td>Mutes the audio.</td> + <td><code>VK_VOLUME_MUTE</code> (0xAD)<br> + <code>APPCOMMAND_VOLUME_MUTE</code></td> + <td><code>kVK_Mute</code> (0x4A)</td> + <td><code>GDK_KEY_AudioMute</code> (0x1008FF12)<br> + <code>Qt::Key_VolumeMute</code> (0x01000071)</td> + <td><code>KEYCODE_VOLUME_MUTE</code> (164)</td> + </tr> + <tr> + <td><code>"AudioVolumeUp" [1]</code></td> + <td>Increases the audio volume.</td> + <td><code>VK_VOLUME_UP</code> (0xAF)<br> + <code>APPCOMMAND_VOLUME_UP</code></td> + <td><code>kVK_VolumeUp</code> (0x48)</td> + <td><code>GDK_KEY_AudioRaiseVolume</code> (0x1008FF13)<br> + <code>Qt::Key_VolumeUp</code> (0x01000072)</td> + <td><code>KEYCODE_VOLUME_UP</code> (24)</td> + </tr> + <tr> + <td><code>"MicrophoneToggle"</code></td> + <td>Toggles the microphone on and off.</td> + <td><code>APPCOMMAND_MIC_ON_OFF_TOGGLE</code></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>"MicrophoneVolumeDown"</code></td> + <td>Decreases the microphone's input volume.</td> + <td><code>APPCOMMAND_MICROPHONE_VOLUME_DOWN</code></td> + <td></td> + <td><code>Qt::Key_MicVolumeDown</code> (0x0100011E)</td> + <td></td> + </tr> + <tr> + <td><code>"MicrophoneVolumeMute"</code></td> + <td>Mutes the microphone input.</td> + <td><code>APPCOMMAND_MICROPHONE_VOLUME_MUTE</code></td> + <td></td> + <td><code>GDK_KEY_AudioMicMute</code> (0x1008FFB2)<br> + <code>Qt::Key_MicMute</code> (0x01000113)</td> + <td><code>KEYCODE_MUTE</code> (91)</td> + </tr> + <tr> + <td><code>"MicrophoneVolumeUp"</code></td> + <td>Increases the microphone's input volume.</td> + <td><code>APPCOMMAND_MICROPHONE_VOLUME_UP</code></td> + <td></td> + <td><code>Qt::Key_MicVolumeUp</code> (0x0100011D)</td> + <td></td> + </tr> + </thead> +</table> + +<p>[1] Internet Explorer, Edge, and Firefox (48 and earlier) use <code>"VolumeUp"</code>, <code>"VolumeDown"</code>, and <code>"VolumeMute"</code> instead of <code>"AudioVolumeUp"</code>, <code>"AudioVolumeDown"</code>, and <code>"AudioVolumeMute"</code>. In Firefox 49 they were updated to match the latest specification. The old names are still used on <a href="/en-US/docs/Mozilla/B2G_OS">Boot to Gecko</a>.</p> + +<h2 id="TV_control_keys">TV control keys</h2> + +<p>These key values represent buttons or keys present on television devices, or computers or phones which have TV support.</p> + +<table class="standard-table"> + <thead> + <tr> + <th rowspan="2" scope="col" style="text-align: left;"><code>KeyboardEvent.key</code> Value</th> + <th rowspan="2" scope="col" style="text-align: left;">Description</th> + <th colspan="4" scope="col" style="text-align: center;">Virtual Keycode</th> + </tr> + <tr> + <th scope="col" style="text-align: left;">Windows</th> + <th scope="col" style="text-align: left;">Mac</th> + <th scope="col" style="text-align: left;">Linux</th> + <th scope="col" style="text-align: left;">Android</th> + </tr> + <tr> + <td><code>"TV"</code> [1]</td> + <td>Switches into TV viewing mode.</td> + <td></td> + <td></td> + <td></td> + <td><code>KEYCODE_TV</code> (170)</td> + </tr> + <tr> + <td><code>"TV3DMode"</code></td> + <td>Toggles 3D TV mode on and off.</td> + <td></td> + <td></td> + <td></td> + <td><code>KEYCODE_3D_MODE</code> (206)</td> + </tr> + <tr> + <td><code>"TVAntennaCable"</code></td> + <td>Toggles between antenna and cable inputs.</td> + <td></td> + <td></td> + <td></td> + <td><code>KEYCODE_TV_ANTENNA_CABLE</code> (242)</td> + </tr> + <tr> + <td><code>"TVAudioDescription"</code></td> + <td>Toggles audio description mode on and off.</td> + <td></td> + <td></td> + <td></td> + <td><code>KEYCODE_TV_AUDIO_DESCRIPTION</code> (252)</td> + </tr> + <tr> + <td><code>"TVAudioDescriptionMixDown"</code></td> + <td>Decreases trhe audio description's mixing volume; reduces the volume of the audio descriptions relative to the program sound.</td> + <td></td> + <td></td> + <td></td> + <td><code>KEYCODE_TV_AUDIO_DESCRIPTION_MIX_DOWN</code> (254)</td> + </tr> + <tr> + <td><code>"TVAudioDescriptionMixUp"</code></td> + <td>Increases the audio description's mixing volume; increases the volume of the audio descriptions relative to the program sound.</td> + <td></td> + <td></td> + <td></td> + <td><code>KEYCODE_TV_AUDIO_DESCRIPTION_MIX_UP</code> (253)</td> + </tr> + <tr> + <td><code>"TVContentsMenu"</code></td> + <td>Displays or hides the media contents available for playback (this may be a channel guide showing the currently airing programs, or a list of media files to play).</td> + <td></td> + <td></td> + <td></td> + <td><code>KEYCODE_TV_CONTENTS_MENU</code> (256)</td> + </tr> + <tr> + <td><code>"TVDataService"</code></td> + <td>Displays or hides the TV's data service menu.</td> + <td></td> + <td></td> + <td></td> + <td><code>KEYCODE_TV_DATA_SERVICE</code> (230)</td> + </tr> + <tr> + <td><code>"TVInput"</code> [2]</td> + <td>Cycles the input mode on an external TV.</td> + <td></td> + <td></td> + <td></td> + <td><code>KEYCODE_TV_INPUT</code> (178)</td> + </tr> + <tr> + <td><code>"TVInputComponent1"</code></td> + <td>Switches to the input "Component 1."</td> + <td></td> + <td></td> + <td></td> + <td><code>KEYCODE_TV_INPUT_COMPONENT_1</code> (249)</td> + </tr> + <tr> + <td><code>"TVInputComponent2"</code></td> + <td>Switches to the input "Component 2."</td> + <td></td> + <td></td> + <td></td> + <td><code>KEYCODE_TV_INPUT_COMPONENT_2</code> (250)</td> + </tr> + <tr> + <td><code>"TVInputComposite1"</code></td> + <td>Switches to the input "Composite 1."</td> + <td></td> + <td></td> + <td></td> + <td><code>KEYCODE_TV_INPUT_COMPOSITE_1</code> (247)</td> + </tr> + <tr> + <td><code>"TVInputComposite2"</code></td> + <td>Switches to the input "Composite 2."</td> + <td></td> + <td></td> + <td></td> + <td><code>KEYCODE_TV_INPUT_COMPOSITE_2</code> (248)</td> + </tr> + <tr> + <td><code>"TVInputHDMI1"</code></td> + <td>Switches to the input "HDMI 1."</td> + <td></td> + <td></td> + <td></td> + <td><code>KEYCODE_TV_INPUT_HDMI_1</code> (243)</td> + </tr> + <tr> + <td><code>"TVInputHDMI2"</code></td> + <td>Switches to the input "HDMI 2."</td> + <td></td> + <td></td> + <td></td> + <td><code>KEYCODE_TV_INPUT_HDMI_2</code> (244)</td> + </tr> + <tr> + <td><code>"TVInputHDMI3"</code></td> + <td>Switches to the input "HDMI 3."</td> + <td></td> + <td></td> + <td></td> + <td><code>KEYCODE_TV_INPUT_HDMI_3</code> (245)</td> + </tr> + <tr> + <td><code>"TVInputHDMI4"</code></td> + <td>Switches to the input "HDMI 4."</td> + <td></td> + <td></td> + <td></td> + <td><code>KEYCODE_TV_INPUT_HDMI_4</code> (246)</td> + </tr> + <tr> + <td><code>"TVInputVGA1"</code></td> + <td>Switches to the input "VGA 1."</td> + <td></td> + <td></td> + <td></td> + <td><code>KEYCODE_TV_INPUT_VGA_1</code> (251)</td> + </tr> + <tr> + <td><code>"TVMediaContext"</code></td> + <td>The Media Context menu key.</td> + <td></td> + <td></td> + <td></td> + <td><code>KEYCODE_TV_MEDIA_CONTEXT_MENU</code> (257)</td> + </tr> + <tr> + <td><code>"TVNetwork"</code></td> + <td>Toggle the TV's network connection on and off.</td> + <td></td> + <td></td> + <td></td> + <td><code>KEYCODE_TV_NETWORK</code> (241)</td> + </tr> + <tr> + <td><code>"TVNumberEntry"</code></td> + <td>Put the TV into number entry mode.</td> + <td></td> + <td></td> + <td></td> + <td><code>KEYCODE_TV_NUMBER_ENTRY</code> (234)</td> + </tr> + <tr> + <td><code>"TVPower"</code> [2]</td> + <td>The device's power button.</td> + <td></td> + <td></td> + <td></td> + <td><code>KEYCODE_TV_POWER</code> (177)</td> + </tr> + <tr> + <td><code>"TVRadioService"</code></td> + <td>Radio button.</td> + <td></td> + <td></td> + <td></td> + <td><code>KEYCODE_TV_RADIO_SERVICE</code> (232)</td> + </tr> + <tr> + <td><code>"TVSatellite"</code></td> + <td>Satellite button.</td> + <td></td> + <td></td> + <td></td> + <td><code>KEYCODE_TV_SATELLITE</code> (237)</td> + </tr> + <tr> + <td><code>"TVSatelliteBS"</code></td> + <td>Broadcast Satellite button.</td> + <td></td> + <td></td> + <td></td> + <td><code>KEYCODE_TV_SATELLITE_BS</code> (238)</td> + </tr> + <tr> + <td><code>"TVSatelliteCS"</code></td> + <td>Communication Satellite button.</td> + <td></td> + <td></td> + <td></td> + <td><code>KEYCODE_TV_SATELLITE_CS</code> (239)</td> + </tr> + <tr> + <td><code>"TVSatelliteToggle"</code></td> + <td>Toggles among available satellites.</td> + <td></td> + <td></td> + <td></td> + <td><code>KEYCODE_TV_SATELLITE_SERVICE</code> (240)</td> + </tr> + <tr> + <td><code>"TVTerrestrialAnalog"</code></td> + <td>Selects analog terrestrial television service (analog cable or antenna reception).</td> + <td></td> + <td></td> + <td></td> + <td><code>KEYCODE_TV_TERRESTRIAL_ANALOG</code> (235)</td> + </tr> + <tr> + <td><code>"TVTerrestrialDigital"</code></td> + <td>Selects digital terrestrial television service (digital cable or antenna receiption).</td> + <td></td> + <td></td> + <td></td> + <td><code>KEYCODE_TV_TERRESTRIAL_DIGITAL</code> (236)</td> + </tr> + <tr> + <td><code>"TVTimer"</code></td> + <td>Timer programming button.</td> + <td></td> + <td></td> + <td></td> + <td><code>KEYCODE_TV_TIMER_PROGRAMMING</code> (258)</td> + </tr> + </thead> +</table> + +<p>[1] Firefox added proper support for the <code>"TV"</code> key in Firefox 37; before that, this key generated the key code <code>"Live"</code>.</p> + +<p>[2] These keys were <code>"Unidentified"</code> until Firefox 37.</p> + +<h2 id="Media_controller_keys">Media controller keys</h2> + +<p>Because modern remote controls for media devices often include buttons beyond the basic controls covered elsewhere in this document, key values are defined for a broad array of these additional buttons.</p> + +<p>The values below are derived in part form a number of consumer electronics technical specifications:</p> + +<ul> + <li><a href="http://atsc.org/standard/a100-dtv-application-software-environment-level-1-dase-1/">DTV Application Software Environment</a> (part of the {{interwiki("wikipedia", "ATSC")}} specification)</li> + <li><a href="http://www.cablelabs.com/specifications/OC-SP-OCAP1.1.3-100603.pdf">Open Cable Application Platform 1.1.3</a></li> + <li><a href="http://www.ce.org/Standards/Standard-Listings/R7-Home-Network-Committee/CEA-2014-B-(ANSI%29.aspx">ANSI/CEA-2014-B</a>: Web-based Protocol and Framework for Remote User Interface on UPnP™ Networks and the Internet</li> + <li><a href="http://developer.android.com/reference/android/view/KeyEvent.html">Android KeyEvent key code values</a></li> +</ul> + +<div class="note"> +<p>Remote controls typically include keys whose values are already defined elsewhere, such as under {{anch("Multimedia keys")}} or {{anch("Audio control keys")}}. Those keys' values will match what's documented in those tables.</p> +</div> + +<table class="standard-table"> + <thead> + <tr> + <th rowspan="2" scope="col" style="text-align: left;"><code>KeyboardEvent.key</code> Value</th> + <th rowspan="2" scope="col" style="text-align: left;">Description</th> + <th colspan="4" scope="col" style="text-align: center;">Virtual Keycode</th> + </tr> + <tr> + <th scope="col" style="text-align: left;">Windows</th> + <th scope="col" style="text-align: left;">Mac</th> + <th scope="col" style="text-align: left;">Linux</th> + <th scope="col" style="text-align: left;">Android</th> + </tr> + <tr> + <td><code>"AVRInput"</code> [3]</td> + <td>Changes the input mode on an external audio/video receiver (AVR) unit.</td> + <td></td> + <td></td> + <td></td> + <td><code>KEYCODE_AVR_INPUT</code> (182)</td> + </tr> + <tr> + <td><code>"AVRPower"</code> [3]</td> + <td>Toggles the power on an external AVR unit.</td> + <td></td> + <td></td> + <td></td> + <td><code>KEYCODE_AVR_POWER</code> (181)</td> + </tr> + <tr> + <td><code>"ColorF0Red"</code> [3]</td> + <td>General-purpose media function key, color-coded red; this has index 0 among the colored keys.</td> + <td><code>VK_COLORED_KEY_0</code></td> + <td></td> + <td></td> + <td><code>KEYCODE_PROG_RED</code> (183)</td> + </tr> + <tr> + <td><code>"ColorF1Green"</code> [3]</td> + <td>General-purpose media funciton key, color-coded green; this has index 1 among the colored keys.</td> + <td><code>VK_COLORED_KEY_1</code></td> + <td></td> + <td></td> + <td><code>KEYCODE_PROG_GREEN</code> (184)</td> + </tr> + <tr> + <td><code>"ColorF2Yellow"</code> [3]</td> + <td>General-purpose media funciton key, color-coded yellow; this has index 2 among the colored keys.</td> + <td><code>VK_COLORED_KEY_2</code></td> + <td></td> + <td></td> + <td><code>KEYCODE_PROG_YELLOW</code> (185)</td> + </tr> + <tr> + <td><code>"ColorF3Blue"</code> [3]</td> + <td>General-purpose media funciton key, color-coded blue; this has index 3 among the colored keys.</td> + <td><code>VK_COLORED_KEY_3</code></td> + <td></td> + <td></td> + <td><code>KEYCODE_PROG_BLUE</code> (186)</td> + </tr> + <tr> + <td><code>"ColorF4Grey"</code></td> + <td>General-purpose media funciton key, color-coded grey; this has index 4 among the colored keys.</td> + <td><code>VK_COLORED_KEY_4</code></td> + <td></td> + <td></td> + <td><code>KEYCODE_PROG_GREY</code></td> + </tr> + <tr> + <td><code>"ColorF5Brown"</code></td> + <td>General-purpose media funciton key, color-coded brown; this has index 5 among the colored keys.</td> + <td><code>VK_COLORED_KEY_5</code></td> + <td></td> + <td></td> + <td><code>KEYCODE_PROG_BROWN</code></td> + </tr> + <tr> + <td><code>"ClosedCaptionToggle"</code></td> + <td>Toggles closed captioning on and off.</td> + <td><code>VK_CC</code></td> + <td></td> + <td></td> + <td><code>KEYCODE_CAPTIONS</code> (175)</td> + </tr> + <tr> + <td><code>"Dimmer"</code></td> + <td>Adjusts the brightness of the device by toggling between two brightness levels <em>or</em> by cycling among multiple brightness levels.</td> + <td><code>VK_DIMMER</code></td> + <td></td> + <td><code>GDK_KEY_BrightnessAdjust</code> (0x1008FF3B)</td> + <td></td> + </tr> + <tr> + <td><code>"DisplaySwap"</code></td> + <td>Cycles among video sources.</td> + <td><code>VK_DISPLAY_SWAP</code></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>"DVR"</code></td> + <td>Switches the input source to the Digital Video Recorder (DVR).</td> + <td></td> + <td></td> + <td></td> + <td><code>KEYCODE_DVR</code> (173)</td> + </tr> + <tr> + <td><code>"Exit"</code></td> + <td>The Exit button, which exits the curreent application or menu.</td> + <td><code>VK_EXIT</code></td> + <td></td> + <td><code>Qt::Key_Exit</code> (0x0102000a)</td> + <td></td> + </tr> + <tr> + <td><code>"FavoriteClear0"</code></td> + <td>Clears the program or content stored in the first favorites list slot.</td> + <td><code>VK_CLEAR_FAVORITE_0</code></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>"FavoriteClear1"</code></td> + <td>Clears the program or content stored in the second favorites list slot.</td> + <td><code>VK_CLEAR_FAVORITE_1</code></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>"FavoriteClear2"</code></td> + <td>Clears the program or content stored in the third favorites list slot.</td> + <td><code>VK_CLEAR_FAVORITE_2</code></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>"FavoriteClear3"</code></td> + <td>Clears the program or content stored in the fourth favorites list slot.</td> + <td><code>VK_CLEAR_FAVORITE_3</code></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>"FavoriteRecall0"</code></td> + <td>Selects (recalls) the program or content stored in the first favorites list slot.</td> + <td><code>VK_RECALL_FAVORITE_0</code></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>"FavoriteRecall1"</code></td> + <td>Selects (recalls) the program or content stored in the second favorites list slot.</td> + <td><code>VK_RECALL_FAVORITE_1</code></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>"FavoriteRecall2"</code></td> + <td>Selects (recalls) the program or content stored in the third favorites list slot.</td> + <td><code>VK_RECALL_FAVORITE_2</code></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>"FavoriteRecall3"</code></td> + <td>Selects (recalls) the program or content stored in the fourth favorites list slot.</td> + <td><code>VK_RECALL_FAVORITE_3</code></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>"FavoriteStore0"</code></td> + <td>Stores the current program or content into the first favorites list slot.</td> + <td><code>VK_STORE_FAVORITE_0</code></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>"FavoriteStore1"</code></td> + <td>Stores the current program or content into the second favorites list slot.</td> + <td><code>VK_STORE_FAVORITE_1</code></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>"FavoriteStore2"</code></td> + <td>Stores the current program or content into the third favorites list slot.</td> + <td><code>VK_STORE_FAVORITE_2</code></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>"FavoriteStore3"</code></td> + <td>Stores the current program or content into the fourth favorites list slot.</td> + <td><code>VK_STORE_FAVORITE_3</code></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>"Guide"</code></td> + <td>Toggles the display of the program or content guide.</td> + <td><code>VK_GUIDE</code></td> + <td></td> + <td><code>Qt::Key_Guide</code> (0x0100011A)</td> + <td><code>KEYCODE_GUIDE</code> (172)</td> + </tr> + <tr> + <td><code>"GuideNextDay"</code></td> + <td>If the guide is currently displayed, this button tells the guide to display the next day's content.</td> + <td><code>VK_NEXT_DAY</code></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>"GuidePreviousDay"</code></td> + <td>If the guide is currently displayed, this button tells the guide to display the previous day's content.</td> + <td><code>VK_PREV_DAY</code></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>"Info"</code></td> + <td>Toggles the display of information about the currently selected content, program, or media.</td> + <td><code>VK_INFO</code></td> + <td></td> + <td><code>Qt::Key_Info</code> (0x0100011B)</td> + <td><code>KEYCODE_INFO</code> (165)</td> + </tr> + <tr> + <td><code>"InstantReplay"</code></td> + <td>Tellls the device to perform an instant replay (typically some form of jumping back a short amount of time then playing it again, possibly but not usually in slow motion).</td> + <td><code>VK_INSTANT_REPLAY</code></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>"Link"</code></td> + <td>Opens content liniked to the current program, if available and possible.</td> + <td><code>VK_LINK</code></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>"ListProgram"</code></td> + <td>Lists the current program.</td> + <td><code>VK_LIST</code></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>"LiveContent"</code></td> + <td>Toggles a display listing currently available live content or programs.</td> + <td><code>VK_LIVE</code></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>"Lock"</code></td> + <td>Locks or unlocks the currently selected content or pgoram.</td> + <td><code>VK_LOCK</code></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>"MediaApps"</code></td> + <td>Presents a list of media applications, such as photo viewers, audio and video players, and games. [1]</td> + <td><code>VK_APPS</code></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>"MediaAudioTrack"</code></td> + <td>The Audio Track key.</td> + <td></td> + <td></td> + <td>GDK_KEY_AudioCycleTrack (0x1008FF9B)<br> + <code>Qt::Key_AudioCycleTrack</code> (0x01000106)</td> + <td><code>KEYCODE_MEDIA_AUDIO_TRACK</code> (222)</td> + </tr> + <tr> + <td><code>"MediaLast"</code></td> + <td>Jumps back to the last-viewed content, program, or other media.</td> + <td><code>VK_LAST</code></td> + <td></td> + <td><code>Qt::Key_MediaLast</code> (0x0100FFFF)</td> + <td><code>KEYCODE_LAST_CHANNEL</code> (229)</td> + </tr> + <tr> + <td><code>"MediaSkipBackward"</code></td> + <td>Skips backward to the previous content or program.</td> + <td></td> + <td></td> + <td></td> + <td><code>KEYCODE_MEDIA_SKIP_BACKWARD</code></td> + </tr> + <tr> + <td><code>"MediaSkipForward"</code></td> + <td>Skips forward to the next content or program.</td> + <td><code>VK_SKIP</code></td> + <td></td> + <td></td> + <td><code>KEYCODE_MEDIA_SKIP_FORWARD</code></td> + </tr> + <tr> + <td><code>"MediaStepBackward"</code></td> + <td>Steps backward to the previous content or program.</td> + <td></td> + <td></td> + <td></td> + <td><code>KEYCODE_MEDIA_STEP_BACKWARD</code></td> + </tr> + <tr> + <td><code>"MediaStepForward"</code></td> + <td>Steps forward to the next content or program.</td> + <td></td> + <td></td> + <td></td> + <td><code>KEYCODE_MEDIA_SKIP_FORWARD</code></td> + </tr> + <tr> + <td><code>"MediaTopMenu"</code></td> + <td>Top Menu button; opens the media's main menu, such as on a DVD or Blu-Ray disc.</td> + <td></td> + <td></td> + <td><code>Qt::Key_TopMenu</code> (0x0100010A)</td> + <td><code>KEYCODE_MEDIA_TOP_MENU</code></td> + </tr> + <tr> + <td><code>"NavigateIn"</code></td> + <td>Navigates into a submenu or option.</td> + <td></td> + <td></td> + <td></td> + <td><code>KEYCODE_NAVIGATE_IN</code></td> + </tr> + <tr> + <td><code>"NavigateNext"</code></td> + <td>Navigates to the next item.</td> + <td></td> + <td></td> + <td></td> + <td><code>KEYCODE_NAVIGATE_NEXT</code></td> + </tr> + <tr> + <td><code>"NavigateOut"</code></td> + <td>Navigates out of the current screen or menu.</td> + <td></td> + <td></td> + <td></td> + <td><code>KEYCODE_NAVIGATE_OUT</code></td> + </tr> + <tr> + <td><code>"NavigatePrevious"</code></td> + <td>Navigates to the previous item.</td> + <td></td> + <td></td> + <td></td> + <td><code>KEYCODE_NAVIGATE_PREVIOUS</code></td> + </tr> + <tr> + <td><code>"NextFavoriteChannel"</code></td> + <td>Cycles to the next channel in the favorites list.</td> + <td><code>VK_NEXT_FAVORITE_CHANNEL</code></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>"NextUserProfile"</code></td> + <td>Cycles to the next saved user profile, if this feature is supported and multiple profiles exist.</td> + <td><code>VK_USER</code></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>"OnDemand"</code></td> + <td>Opens the user interface for selecting on demand content or programs to watch.</td> + <td><code>VK_ON_DEMAND</code></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>"Pairing"</code></td> + <td>Starts the process of pairing the remote with a device to be controlled.</td> + <td></td> + <td></td> + <td></td> + <td><code>KEYCODE_PAIRING</code> (225)</td> + </tr> + <tr> + <td><code>"PinPDown"</code></td> + <td>A button to move the picture-in-picture view downward.</td> + <td><code>VK_PINP_DOWN</code></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>"PinPMove"</code></td> + <td>A button to control moving the picture-in-picture view.</td> + <td><code>VK_PINP_MOVE</code></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>"PinPToggle"</code></td> + <td>Toggles display of th epicture-in-picture view on and off.</td> + <td><code>VK_PINP_TOGGLE</code></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>"PinPUp"</code></td> + <td>A button to move the picture-in-picture view upward.</td> + <td><code>VK_PINP_UP</code></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>"PlaySpeedDown"</code></td> + <td>Decreases the media playback rate.</td> + <td><code>VK_PLAY_SPEED_DOWN</code></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>"PlaySpeedReset"</code></td> + <td>Returns the media playback rate to normal.</td> + <td><code>VK_PLAY_SPEED_RESET</code></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>"PlaySpeedUp"</code></td> + <td>Increases the media playback rate.</td> + <td><code>VK_PLAY_SPEED_UP</code></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>"RandomToggle"</code></td> + <td>Toggles random media (also known as "shuffle mode") on and off.</td> + <td><code>VK_RANDOM_TOGGLE</code></td> + <td></td> + <td><code>GDK_KEY_AudioRandomPlay</code> (0x1008FF99)</td> + <td></td> + </tr> + <tr> + <td><code>"RcLowBattery"</code></td> + <td>A code sent when the remote control's battery is low. This doesn't actually correspond to a physical key at all.</td> + <td><code>VK_RC_LOW_BATTERY</code></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>"RecordSpeedNext"</code></td> + <td>Cycles among the available media recording speeds.</td> + <td><code>VK_RECORD_SPEED_NEXT</code></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>"RfBypass"</code></td> + <td>Toggles radio frequency (RF) input bypass mode on and off. RF bypass mode passes RF input directly to the RF output without any processing or filtering.</td> + <td><code>VK_RF_BYPASS</code></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>"ScanChannelsToggle"</code></td> + <td>Toggles the channel scan mode on and off; this is a mode which flips through channels automatically until the user stops the scan.</td> + <td><code>VK_SCAN_CHANNELS_TOGGLE</code></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>"ScreenModeNext"</code></td> + <td>Cycles through the available screen display modes.</td> + <td><code>VK_SCREEN_MODE_NEXT</code></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>"Settings"</code></td> + <td>Toggles display of the device's settings screen on and off.</td> + <td><code>VK_SETTINGS</code></td> + <td></td> + <td><code>Qt::Key_Settings</code> (0x0100011C)</td> + <td><code>KEYCODE_SETTINGS</code></td> + </tr> + <tr> + <td><code>"SplitScreenToggle"</code></td> + <td>Toggles split screen display mode on and off.</td> + <td><code>VK_SPLIT_SCREEN_TOGGLE</code></td> + <td></td> + <td><code>GDK_KEY_SplitScreen (</code>0x1008FF7D)<br> + <code>Qt::Key_SplitScreen</code> (0x010000ED)</td> + <td></td> + </tr> + <tr> + <td><code>"STBInput"</code> [3]</td> + <td>Cycles among input modes on an external set-top box (STB).</td> + <td></td> + <td></td> + <td></td> + <td><code>KEYCODE_STB_INPUT</code> (180)</td> + </tr> + <tr> + <td><code>"STBPower"</code> [3]</td> + <td>Toggles on and off an external STB.</td> + <td></td> + <td></td> + <td></td> + <td><code>KEYCODE_STB_POWER</code> (179)</td> + </tr> + <tr> + <td><code>"Subtitle"</code></td> + <td>Toggles the display of subtitles on and off if they're available.</td> + <td><code>VK_SUBTITLE</code></td> + <td></td> + <td><code>GDK_KEY_Subtitle</code> (0x1008FF9A)</td> + <td><code>KEYCODE_CAPTIONS</code> (175)</td> + </tr> + <tr> + <td><code>"Teletext"</code></td> + <td>Toggles display of {{interwiki("wikipedia", "teletext")}}, if available.</td> + <td><code>VK_TELETEXT</code></td> + <td></td> + <td></td> + <td><code>KEYCODE_TV_TELETEXT</code> (233)</td> + </tr> + <tr> + <td><code>"VideoModeNext"</code> [3]</td> + <td>Cycles through the available video modes.</td> + <td><code>VK_VIDEO_MODE_NEXT</code></td> + <td></td> + <td><code>GDK_KEY_Next_VMode</code> (0x1008FE22)</td> + <td></td> + </tr> + <tr> + <td><code>"Wink"</code></td> + <td>Causes the device to identify itself in some fashion, such as by flashing a light, briefly changing the brightness of indicator lights, or emitting a tone.</td> + <td><code>VK_WINK</code></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>"ZoomToggle"</code> [2]</td> + <td>Toggles between full-screen and scaled content display, or otherwise change the magnification level.</td> + <td><code>VK_ZOOM</code> (0xFB)</td> + <td></td> + <td><code>Qt::Key_Zoom</code> (0x01020006)</td> + <td><code>KEYCODE_TV_ZOOM_MODE</code> (255)</td> + </tr> + </thead> +</table> + +<p>[1] Don't confuse the media controller <code>VK_APPS</code> key with the Windows <code>VK_APPS</code> key, which is also known as <code>VK_CONTEXT_MENU</code>. That key is encoded as <code>"ContextMenu"</code>.</p> + +<p>[2] Internet Explorer (tested on release 9 and 11) and Firefox 36 and earlier identify the zoom toggle button as <code>"Zoom"</code>. Firefox 37 corrects this to <code>"ZoomToggle"</code>.</p> + +<p>[3] These keys were <code>"Unidentified"</code> until Firefox 37.</p> + +<h2 id="Speech_recognition_keys">Speech recognition keys</h2> + +<p>These special multimedia keys are used to control speech recognition features.</p> + +<table class="standard-table"> + <thead> + <tr> + <th rowspan="2" scope="col" style="text-align: left;"><code>KeyboardEvent.key</code> Value</th> + <th rowspan="2" scope="col" style="text-align: left;">Description</th> + <th colspan="4" scope="col" style="text-align: center;">Virtual Keycode</th> + </tr> + <tr> + <th scope="col" style="text-align: left;">Windows</th> + <th scope="col" style="text-align: left;">Mac</th> + <th scope="col" style="text-align: left;">Linux</th> + <th scope="col" style="text-align: left;">Android</th> + </tr> + <tr> + <td><code>"SpeechCorrectionList"</code> [1]</td> + <td>Presents a list of possible corrections for a word which was incorrectly identified.</td> + <td><code>APPCOMMAND_CORRECTION_LIST</code></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>"SpeechInputToggle"</code> [2]</td> + <td>Toggles between dictation mode and command/control mode. This lets the speech engine know whether to interpret spoken words as input text or as commands.</td> + <td><code>APPCOMMAND_DICTATE_OR_COMMAND_CONTROL_TOGGLE</code></td> + <td></td> + <td></td> + <td></td> + </tr> + </thead> +</table> + +<p>[1] The <code>APPCOMMAND_CORRECTION_LIST</code> command on Windows generates <code>"Unidentified"</code> on Firefox.</p> + +<p>[2] The <code>APPCOMMAND_DICTATE_OR_COMMAND_CONTROL_TOGGLE</code> command on Windows generates <code>"Unidentified"</code> on Firefox.</p> + +<h2 id="Document_keys">Document keys</h2> + +<p>These keys control documents. In the specification, they're included in other sets of keys, such as the media keys, but they make more sense when considered to be their own category.</p> + +<table class="standard-table"> + <thead> + <tr> + <th rowspan="2" scope="col" style="text-align: left;"><code>KeyboardEvent.key</code> Value</th> + <th rowspan="2" scope="col" style="text-align: left;">Description</th> + <th colspan="4" scope="col" style="text-align: center;">Virtual Keycode</th> + </tr> + <tr> + <th scope="col" style="text-align: left;">Windows</th> + <th scope="col" style="text-align: left;">Mac</th> + <th scope="col" style="text-align: left;">Linux</th> + <th scope="col" style="text-align: left;">Android</th> + </tr> + <tr> + <td><code>"Close"</code> [1]</td> + <td>Closes the current document or message. Must not exit the application.</td> + <td><code>APPCOMMAND_CLOSE</code></td> + <td></td> + <td><code>GDK_KEY_Close</code> (0x1008FF56)<br> + <code>Qt::Key_Close</code> (0x010000CE)</td> + <td><code>KEYCODE_MEDIA_CLOSE</code> (128)</td> + </tr> + <tr> + <td><code>"New"</code> [1]</td> + <td>Creates a new document or message.</td> + <td><code>APPCOMMAND_NEW</code></td> + <td></td> + <td><code>GDK_KEY_New</code> (0x1008FF68)<br> + <code>Qt::Key_New</code> (0x01000120)</td> + <td></td> + </tr> + <tr> + <td><code>"Open"</code> [1]</td> + <td>Opens an existing document or message.</td> + <td><code>APPCOMMAND_OPEN</code></td> + <td></td> + <td><code>GDK_KEY_Open</code> (0x1008FF6B)<br> + <code>Qt::Key_Open</code> (0x01000121)</td> + <td></td> + </tr> + <tr> + <td><code>"Print"</code></td> + <td>Prints the current document or message.</td> + <td><code>APPCOMMAND_PRINT</code></td> + <td></td> + <td><code>GDK_KEY_Print</code> (0xFF61)<br> + <code>Qt::Print</code> (0x01000009)</td> + <td></td> + </tr> + <tr> + <td><code>"Save"</code> [1]</td> + <td>Saves the current document or message.</td> + <td><code>APPCOMMAND_SAVE</code></td> + <td></td> + <td><code>GDK_KEY_Save</code> (0x1008FF77)<br> + <code>Qt::Key_Save</code> (0x010000EA)</td> + <td></td> + </tr> + <tr> + <td><code>"SpellCheck"</code> [1]</td> + <td>Starts spell checking the current document.</td> + <td><code>APPCOMMAND_SPELL_CHECK</code></td> + <td></td> + <td><code>GDK_KEY_Spell</code> (0x1008FF7C)<br> + <code>Qt::Key_Spell</code> (0x010000EC)</td> + <td></td> + </tr> + <tr> + <td><code>"MailForward"</code> [1]</td> + <td>Opens the user interface to forward a message.</td> + <td><code>APPCOMMAND_FORWARD_MAIL</code></td> + <td></td> + <td><code>GDK_KEY_MailForward</code> (0x1008FF90)<br> + <code>Qt::Key_MailForward</code> (0x010000FB)</td> + <td></td> + </tr> + <tr> + <td><code>"MailReply"</code> [1]</td> + <td>Opens the user interface to reply to a message.</td> + <td><code>APPCOMMAND_REPLY_TO_MAIL</code></td> + <td></td> + <td><code>GDK_KEY_Reply</code> (0x1008FF72)<br> + <code>Qt::Key_Reply</code> (0x010000E5)</td> + <td></td> + </tr> + <tr> + <td><code>"MailSend"</code> [1]</td> + <td>Sends the current message.</td> + <td><code>APPCOMMAND_SEND_MAIL</code></td> + <td></td> + <td><code>GDK_KEY_Send</code> (0x1008FF7B)<br> + <code>Qt::Key_Send</code> (0x010000EB)</td> + <td></td> + </tr> + </thead> +</table> + +<p>[1] Prior to Firefox 37, this key generated the key value <code>"Unidentified"</code>.</p> + +<h2 id="Application_selector_keys">Application selector keys</h2> + +<p>Some keyboards offer special keys for launching or switching to certain common applications. Key values for those are listed here.</p> + +<table class="standard-table"> + <thead> + <tr> + <th rowspan="2" scope="col" style="text-align: left;"><code>KeyboardEvent.key</code> Value</th> + <th rowspan="2" scope="col" style="text-align: left;">Description</th> + <th colspan="4" scope="col" style="text-align: center;">Virtual Keycode</th> + </tr> + <tr> + <th scope="col" style="text-align: left;">Windows</th> + <th scope="col" style="text-align: left;">Mac</th> + <th scope="col" style="text-align: left;">Linux</th> + <th scope="col" style="text-align: left;">Android</th> + </tr> + <tr> + <td><code>"LaunchCalculator"</code> [5]</td> + <td>The <kbd>Calculator</kbd> key, often labeled with an icon. This is often used as a generic application launcher key (<code>APPCOMMAND_LAUNCH_APP2</code>).</td> + <td><code>APPCOMMAND_LAUNCH_APP2</code></td> + <td></td> + <td><code>GDK_KEY_Calculator</code> (0x1008FF1D)<br> + <code>Qt::Key_Calculator</code> (0x010000CB)</td> + <td><code>KEYCODE_CALCULATOR</code> (210)</td> + </tr> + <tr> + <td><code>"LaunchCalendar"</code> [5]</td> + <td>The <kbd>Calendar</kbd> key, often labeled with an icon.</td> + <td></td> + <td></td> + <td><code>GDK_KEY_Calendar</code> (0x1008FF20)<br> + <code>Qt::Key_Calendar</code> (0x010000E4)</td> + <td><code>KEYCODE_CALENDAR</code> (208)</td> + </tr> + <tr> + <td><code>"LaunchContacts"</code></td> + <td>The <kbd>Contacts</kbd> key.</td> + <td></td> + <td></td> + <td></td> + <td><code>KEYCODE_CONTACTS</code> (207)</td> + </tr> + <tr> + <td><code>"LaunchMail"</code></td> + <td>The <kbd>Mail</kbd> key. This is often displayed with an icon.</td> + <td><code>VK_LAUNCH_MAIL</code> (0xB4)<br> + <code>APPCOMMAND_LAUNCH_MAIL</code></td> + <td></td> + <td><code>GDK_KEY_Mail</code> (0x1008FF19)<br> + <code>Qt::Key_LaunchMail</code> (0x010000A0)</td> + <td><code>KEYCODE_ENVELOPE</code> (65)</td> + </tr> + <tr> + <td><code>"LaunchMediaPlayer"</code> [1]</td> + <td>The <kbd>Media Player</kbd> key.</td> + <td><code>VK_LAUNCH_MEDIA_SELECT</code> (0xB5)<br> + <code>APPCOMMAND_LAUNCH_MEDIA_SELECT</code></td> + <td></td> + <td><code>GDK_KEY_CD</code> (0x1008FF53)<br> + <code>GDK_KEY_Video</code> (0x1008FF87)<br> + <code>GDK_KEY_AudioMedia</code> (0x1008FF32)<br> + <code>Qt::Key_LaunchMedia</code> (0x010000A1)</td> + <td></td> + </tr> + <tr> + <td><code>"LaunchMusicPlayer"</code> [5]</td> + <td>The <kbd>Music Player</kbd> key, often labeled with an icon.</td> + <td></td> + <td></td> + <td><code>GDK_KEY_Music</code> (0x1008FF92)<br> + <code>Qt::Key_Music</code> (0x010000FD)</td> + <td><code>KEYCODE_MUSIC</code> (209)</td> + </tr> + <tr> + <td><code>"LaunchMyComputer"</code> [5]</td> + <td>The <kbd>My Computer</kbd> key on Windows keyboards. This is often used as a generic application launcher key (<code>APPCOMMAND_LAUNCH_APP1</code>).</td> + <td><code>APPCOMMAND_LAUNCH_APP1</code></td> + <td></td> + <td><code>GDK_KEY_MyComputer</code> (0x1008FF33)<br> + <code>GDK_KEY_Explorer</code> (0x1008FF5D)</td> + <td></td> + </tr> + <tr> + <td><code>"LaunchPhone"</code></td> + <td>The <kbd>Phone</kbd> key, to open the phone dialer application if one is present.</td> + <td></td> + <td></td> + <td><code>GDK_KEY_Phone</code> (0x1008FF6E)<br> + <code>Qt::Key_Phone</code> (0x010000E3)</td> + <td></td> + </tr> + <tr> + <td><code>"LaunchScreenSaver"</code> [5]</td> + <td>The <kbd>Screen Saver</kbd> key.</td> + <td></td> + <td></td> + <td><code>GDK_KEY_ScreenSaver</code> (0x1008FF2D)<br> + <code>Qt::Key_ScreenSaver</code> (0x010000BA)</td> + <td></td> + </tr> + <tr> + <td><code>"LaunchSpreadsheet"</code> [4]</td> + <td>The <kbd>Spreadsheet</kbd> key. This key may be labeled with an icon.</td> + <td></td> + <td></td> + <td><code>GDK_KEY_Excel</code> (0x1008FF5C)<br> + <code>Qt::Key_Excel</code> (0x010000D4)</td> + <td></td> + </tr> + <tr> + <td><code>"LaunchWebBrowser"</code> [4]</td> + <td>The <kbd>Web Browser</kbd> key. This key is frequently labeled with an icon.</td> + <td></td> + <td></td> + <td><code>GDK_KEY_WWW</code> (0x1008FF2E)<br> + <code>Qt::Key_WWW</code> (0x010000BB)</td> + <td><code>KEYCODE_EXPLORER</code> (64)</td> + </tr> + <tr> + <td><code>"LaunchWebCam"</code> [5]</td> + <td>The <kbd>WebCam</kbd> key. Opens the webcam application.</td> + <td></td> + <td></td> + <td><code>GDK_KEY_WebCam</code> (0x1008FF8F)<br> + <code>Qt::Key_WebCam</code> (0x010000FA)</td> + <td></td> + </tr> + <tr> + <td><code>"LaunchWordProcessor"</code> [5]</td> + <td>The <kbd>Word Processor</kbd> key. This may be an icon of a specific word processor application, or a generic document icon.</td> + <td></td> + <td></td> + <td><code>GDK_KEY_Word</code> (0x1008FF89)<br> + <code>Qt::Key_Word</code> (0x010000F4)</td> + <td></td> + </tr> + <tr> + <td><code>"LaunchApplication1"</code> [2]</td> + <td>The first generic application launcher button.</td> + <td><code>VK_LAUNCH_APP1</code> (0xB6)<br> + <code>APPCOMMAND_LAUNCH_APP1</code></td> + <td></td> + <td><code>GDK_KEY_Launch0</code> (0x1008FF40)<br> + <code>Qt::Key_Launch0</code> (0x010000A2)</td> + <td></td> + </tr> + <tr> + <td><code>"LaunchApplication2"</code> [3]</td> + <td>The second generic application launcher button.</td> + <td><code>VK_LAUNCH_APP2</code> (0xB7)<br> + <code>APPCOMMAND_LAUNCH_APP2</code></td> + <td></td> + <td><code>GDK_KEY_Launch1</code> (0x1008FF41)<br> + <code>Qt::Key_Launch1</code> (0x010000A3)</td> + <td></td> + </tr> + <tr> + <td><code>"LaunchApplication3"</code></td> + <td>The third generic application launcher button.</td> + <td></td> + <td></td> + <td><code>GDK_KEY_Launch2</code> (0x1008FF42)<br> + <code>Qt::Key_Launch2</code> (0x010000A4)</td> + <td></td> + </tr> + <tr> + <td><code>"LaunchApplication4"</code></td> + <td>The fourth generic application launcher button.</td> + <td></td> + <td></td> + <td><code>GDK_KEY_Launch3</code> (0x1008FF43)<br> + <code>Qt::Key_Launch3</code> (0x010000A5)</td> + <td></td> + </tr> + <tr> + <td><code>"LaunchApplication5"</code></td> + <td>The fifth generic application launcher button.</td> + <td></td> + <td></td> + <td><code>GDK_KEY_Launch4</code> (0x1008FF44)<br> + <code>Qt::Key_Launch4</code> (0x010000A6)</td> + <td></td> + </tr> + <tr> + <td><code>"LaunchApplication6"</code></td> + <td>The sixth generic application launcher button.</td> + <td></td> + <td></td> + <td><code>GDK_KEY_Launch5</code> (0x1008FF45)<br> + <code>Qt::Key_Launch5</code> (0x010000A7)</td> + <td></td> + </tr> + <tr> + <td><code>"LaunchApplication7"</code></td> + <td>The seventh generic application launcher button.</td> + <td></td> + <td></td> + <td><code>GDK_KEY_Launch6</code> (0x1008FF46)<br> + <code>Qt::Key_Launch6</code> (0x010000A8)</td> + <td></td> + </tr> + <tr> + <td><code>"LaunchApplication8"</code></td> + <td>The eighth generic application launcher button.</td> + <td></td> + <td></td> + <td><code>GDK_KEY_Launch7</code> (0x1008FF47)<br> + <code>Qt::Key_Launch7</code> (0x010000A9)</td> + <td></td> + </tr> + <tr> + <td><code>"LaunchApplication9"</code></td> + <td>The ninth generic application launcher button.</td> + <td></td> + <td></td> + <td><code>GDK_KEY_Launch8</code> (0x1008FF48)<br> + <code>Qt::Key_Launch8</code> (0x010000AA)</td> + <td></td> + </tr> + <tr> + <td><code>"LaunchApplication10"</code></td> + <td>The 10th generic application launcher button.</td> + <td></td> + <td></td> + <td><code>GDK_KEY_Launch9</code> (0x1008FF49)<br> + <code>Qt::Key_Launch9</code> (0x010000AB)</td> + <td></td> + </tr> + <tr> + <td><code>"LaunchApplication11"</code></td> + <td>The 11th generic application launcher button.</td> + <td></td> + <td></td> + <td><code>GDK_KEY_LaunchA</code> (0x1008FF4A)<br> + <code>Qt::Key_LaunchA</code> (0x010000AC)</td> + <td></td> + </tr> + <tr> + <td><code>"LaunchApplication12"</code></td> + <td>The 12th generic application launcher button.</td> + <td></td> + <td></td> + <td><code>GDK_KEY_LaunchB</code> (0x1008FF4B)<br> + <code>Qt::Key_LaunchB</code> (0x010000AD)</td> + <td></td> + </tr> + <tr> + <td><code>"LaunchApplication13"</code></td> + <td>The 13th generic application launcher button.</td> + <td></td> + <td></td> + <td><code>GDK_KEY_LaunchC</code> (0x1008FF4C)<br> + <code>Qt::Key_LaunchC</code> (0x010000AE)</td> + <td></td> + </tr> + <tr> + <td><code>"LaunchApplication14"</code></td> + <td>The 14th generic application launcher button.</td> + <td></td> + <td></td> + <td><code>GDK_KEY_LaunchD</code> (0x1008FF4D)<br> + <code>Qt::Key_LaunchD</code> (0x010000AF)</td> + <td></td> + </tr> + <tr> + <td><code>"LaunchApplication15"</code></td> + <td>The 15th generic application launcher button.</td> + <td></td> + <td></td> + <td><code>GDK_KEY_LaunchE</code> (0x1008FF4E)<br> + <code>Qt::Key_LaunchE</code> (0x010000B0)</td> + <td></td> + </tr> + <tr> + <td><code>"LaunchApplication16"</code></td> + <td>The 16th generic application launcher button.</td> + <td></td> + <td></td> + <td><code>GDK_KEY_LaunchF</code> (0x1008FF4F)<br> + <code>Qt::Key_LaunchF</code> (0x010000B1)</td> + <td></td> + </tr> + </thead> +</table> + +<p>[1] Internet Explorer, Edge, and Firefox (36 and earlier) use <code>"SelectMedia"</code> instead of <code>"LaunchMediaPlayer"</code>. Firefox 37 through Firefox 48 use <code>"MediaSelect"</code>. Firefox 49 has been updated to match the latest specification, and to return <code>"LaunchMediaPlayer"</code>.</p> + +<p>[2] Google Chrome 57 and earlier returned <code>"LaunchMyComputer"</code> instead of <code>"LaunchApplication1"</code>. See <a href="https://bugs.chromium.org/p/chromium/issues/detail?id=612743">Chrome Bug 612743</a> for more information.</p> + +<p>[3] Google Chrome 57 and earlier returned <code>"LaunchCalculator"</code> instead of <code>"LaunchApplication2"</code>. See <a href="https://bugs.chromium.org/p/chromium/issues/detail?id=612743">Chrome Bug 612743</a> for more information.</p> + +<p>[4] Prior to Firefox 37, Firefox returned the key code <code>"LaunchApplication1"</code> instead of "<code>LaunchWebBrowser"</code> for the Web browser key.</p> + +<p>[5] Firefox introduced support for this key in Firefox 37; prior to that, this key was reported as <code>"Unidentified"</code>.</p> + +<h2 id="Browser_control_keys">Browser control keys</h2> + +<p>Some keyboards include special keys for controlling Web browsers. Those keys follow.</p> + +<table class="standard-table"> + <thead> + <tr> + <th rowspan="2" scope="col" style="text-align: left;"><code>KeyboardEvent.key</code> Value</th> + <th rowspan="2" scope="col" style="text-align: left;">Description</th> + <th colspan="4" scope="col" style="text-align: center;">Virtual Keycode</th> + </tr> + <tr> + <th scope="col" style="text-align: left;">Windows</th> + <th scope="col" style="text-align: left;">Mac</th> + <th scope="col" style="text-align: left;">Linux</th> + <th scope="col" style="text-align: left;">Android</th> + </tr> + <tr> + <td><code>"BrowserBack"</code></td> + <td>Navigates to the previous content or page in the current Web view's history.</td> + <td><code>VK_BROWSER_BACK</code> (0xA6)<br> + <code>APPCOMMAND_BROWSER_BACKWARD</code></td> + <td></td> + <td><code>GDK_KEY_Back</code> (0x1008FF26)<br> + <code>Qt::Key_Back</code> (0x01000061)</td> + <td><code>KEYCODE_BACK</code> (4)</td> + </tr> + <tr> + <td><code>"BrowserFavorites"</code> [1]</td> + <td>Opens the user's list of bookmarks/favorites.</td> + <td><code>VK_BROWSER_FAVORITES</code> (0xAB)<br> + <code>APPCOMMAND_BROWSER_FAVORITES</code></td> + <td></td> + <td><code>GDK_KEY_Favorites</code> (0x1008FF30)<br> + <code>GDK_KEY_MySites</code> (0x1008FF67)<br> + <code>Qt::Favorites</code> (0x01000091)</td> + <td><code>KEYCODE_BOOKMARK</code> (174)</td> + </tr> + <tr> + <td><code>"BrowserForward"</code></td> + <td>Navigates to the next content or page in the current Web view's history.</td> + <td><code>VK_BROWSER_FORWARD</code> (0xA7)<br> + <code>APPCOMMAND_BROWSER_FORWARD</code></td> + <td></td> + <td><code>GDK_KEY_Forward</code> (0x1008FF27)<br> + <code>Qt::Key_Forward</code> (0x01000062)</td> + <td><code>KEYCODE_FORWARD</code> (125)</td> + </tr> + <tr> + <td><code>"BrowserHome"</code></td> + <td>Navigates to the user's preferred home page.</td> + <td><code>VK_BROWSER_HOME</code> (0xAC)<br> + <code>APPCOMMAND_BROWSER_HOME</code></td> + <td></td> + <td><code>GDK_KEY_HomePage</code> (0x1008FF18)<br> + <code>Qt::Key_HomePage</code> (0x01000090)</td> + <td><code>KEYCODE_HOME</code> (3)</td> + </tr> + <tr> + <td><code>"BrowserRefresh"</code></td> + <td>Refreshes the current page or contentl.</td> + <td><code>VK_BROWSER_REFRESH</code> (0xA8)<br> + <code>APPCOMMAND_BROWSER_REFRESH</code></td> + <td></td> + <td><code>GDK_KEY_Refresh</code> (0x1008FF29)<br> + <code>GDK_KEY_Reload</code> (0x1008FF73)</td> + <td></td> + </tr> + <tr> + <td><code>"BrowserSearch"</code></td> + <td>Activates the user's preferred search engine or the search interface within their browser.</td> + <td><code>VK_BROWSER_SEARCH</code> (0xAA)<br> + <code>APPCOMMAND_BROWSER_SEARCH</code></td> + <td></td> + <td><code>GDK_KEY_Search</code> (0x1008FF1B)<br> + <code>Qt::Key_Search</code> (0x01000092)</td> + <td><code>KEYCODE_SEARCH</code> (84)</td> + </tr> + <tr> + <td><code>"BrowserStop"</code></td> + <td>Stops loading the currently displayed Web view or content.</td> + <td><code>VK_BROWSER_STOP</code> (0xA9)<br> + <code>APPCOMMAND_BROWSER_STOP</code></td> + <td></td> + <td><code>GDK_KEY_Stop</code> (0x1008FF28)<br> + <code>Qt::Key_Search</code> (0x01000063)</td> + <td></td> + </tr> + </thead> +</table> + +<p>[1] Prior to Firefox 37, this key's value was reported as <code>"Unidentified"</code>.</p> + +<h2 id="Numeric_keypad_keys">Numeric keypad keys</h2> + +<p>These keys are found on the keyboard's numeric keypad. However, not all are present on every keyboard. Although typical numeric keypads have numeric keys from <kbd>0</kbd> to <kbd>9</kbd> (encoded as <code>"0"</code> through <code>"9"</code>), some multimedia keyboards include additional number keys for higher numbers.</p> + +<div class="note"> +<p>The <kbd>10</kbd> key, if present, generates events with the <code>key</code> value of <code>"0"</code>.</p> +</div> + +<table class="standard-table"> + <thead> + <tr> + <th rowspan="2" scope="col" style="text-align: left;"><code>KeyboardEvent.key</code> Value</th> + <th rowspan="2" scope="col" style="text-align: left;">Description</th> + <th colspan="4" scope="col" style="text-align: center;">Virtual Keycode</th> + </tr> + <tr> + <th scope="col" style="text-align: left;">Windows</th> + <th scope="col" style="text-align: left;">Mac</th> + <th scope="col" style="text-align: left;">Linux</th> + <th scope="col" style="text-align: left;">Android</th> + </tr> + <tr> + <td><code>"Decimal"</code> [1] {{obsolete_inline}}</td> + <td>The decimal point key (typically <kbd>.</kbd> or <kbd>,</kbd> depending on the region. In newer browsers, this value to simply be the character generated by the decimal key (one of those two characters). [1]</td> + <td><code>VK_DECIMAL</code> (0x6E)</td> + <td><code>kVK_ANSI_KeypadDecimal</code> (0x41)</td> + <td><code>GDK_KEY_KP_Decimal</code> (0xFFAE)<br> + </td> + <td><code>KEYCODE_NUMPAD_DOT</code> (158)</td> + </tr> + <tr> + <td><code>"Key11"</code></td> + <td>The <kbd>11</kbd> key found on certain media numeric keypads.</td> + <td></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>"Key12"</code></td> + <td>The <kbd>12</kbd> key found on certain media numeric keypads.</td> + <td></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td><code>"Multiply"</code> [1] {{obsolete_inline}}</td> + <td>The numeric keypad's multiplication key, <kbd>*</kbd>.</td> + <td><code>VK_MULTIPLY</code> (0x6A)</td> + <td><code>kVK_ANSI_KeypadMultiply</code> (0x43)</td> + <td><code>GDK_KEY_KP_Multiply</code> (0xFFAA)<br> + <code>Qt::Key_Multiply</code> (0x0D7)</td> + <td><code>KEYCODE_NUMPAD_MULTIPLY</code> (155)</td> + </tr> + <tr> + <td><code>"Add"</code> [1] {{obsolete_inline}}</td> + <td>The numeric keypad's addition key, <kbd>+</kbd>.</td> + <td><code>VK_ADD</code> (0x6B)</td> + <td><code>kVK_ANSI_KeypadPlus</code> (0x45)</td> + <td><code>GDK_KEY_KP_Add</code> (0xFFAB)</td> + <td><code>KEYCODE_NUMPAD_ADD</code> (157)</td> + </tr> + <tr> + <td><code>"Clear"</code></td> + <td>The numeric keypad's <kbd>Clear</kbd> key.</td> + <td></td> + <td><code>kVK_ANSI_KeypadClear</code> (0x47)</td> + <td><code>GDK_KEY_Clear</code> (0xFF0B)<br> + <code>Qt::Key_Clear</code> (0x0100000B)</td> + <td><code>KEYCODE_CLEAR</code> (28)</td> + </tr> + <tr> + <td><code>"Divide"</code> [1] {{obsolete_inline}}</td> + <td>The numeric keypad's division key, /.</td> + <td><code>VK_DIVIDE</code> (0x6F)</td> + <td><code>kVK_ANSI_KeypadDivide</code> (0x4B)</td> + <td><code>GDK_KEY_KP_Divide</code> (0xFFAF)<br> + <code>Qt::Key_Slash</code> (0x2F)</td> + <td><code>KEYCODE_NUMPAD_DIVIDE</code> (154)</td> + </tr> + <tr> + <td><code>"Subtract"</code> [1] {{obsolete_inline}}</td> + <td>The numeric keypad's subtraction key, -.</td> + <td><code>VK_SUBTRACT</code> (0x6D)</td> + <td><code>kVK_ANSI_KeypadMinus</code> (0x4E)</td> + <td><code>GDK_KEY_KP_Subtract</code> (0xFFAD)</td> + <td><code>KEYCODE_NUMPAD_SUBTRACT</code> (156)</td> + </tr> + <tr> + <td><code>"Separator"</code> [1]</td> + <td>The numeric keypad's places separator character (in the United States, this is a comma, but elsewhere it is frequently a period).</td> + <td><code>VK_SEPARATOR</code> (0x6C)</td> + <td><code>kVK_JIS_KeypadComma</code> (0x5F)</td> + <td><code>GDK_KEY_KP_Separator</code> (0xFFAC)<br> + </td> + <td><code>KEYCODE_NUMPAD_COMMA</code> (159)</td> + </tr> + <tr> + <td>"0" through "9"</td> + <td>The actual digit keys on the numeric keypad.</td> + <td><code>VK_NUMPAD0</code> (0x60) - <code>VK_NUMPAD9</code> (0x69)</td> + <td><code>kVK_Keypad0</code> (0x52) - <code>kVK_Keypad9</code> (0x5C)</td> + <td><code>GDK_KEY_KP_0</code> (0xFFB0) - <code>GDK_KEY_KP_9</code> (0xFFB9)</td> + <td><code>KEYCODE_NUMPAD_0</code> (144) - <code>KEYCODE_NUMPAD_9</code> (153)</td> + </tr> + </thead> +</table> + +<p>[1] While older browsers used words like <code>"Add"</code>, <code>"Decimal"</code>, <code>"Multiply"</code>, and so forth modern browsers identify these using the actual character (<code>"+"</code>, <code>"."</code>, <code>"*"</code>, and so forth).</p> diff --git a/files/fr/web/api/keyboardevent/keyboardevent/index.html b/files/fr/web/api/keyboardevent/keyboardevent/index.html new file mode 100644 index 0000000000..2f63832ae4 --- /dev/null +++ b/files/fr/web/api/keyboardevent/keyboardevent/index.html @@ -0,0 +1,86 @@ +--- +title: KeyboardEvent() +slug: Web/API/KeyboardEvent/KeyboardEvent +tags: + - API + - Clavier + - Constructeur + - DOM + - évènements +translation_of: Web/API/KeyboardEvent/KeyboardEvent +--- +<p>{{APIRef("DOM Events")}}</p> + +<p>Le constructeur <strong><code>KeyboardEvent()</code></strong> crée un nouveau {{domxref("KeyboardEvent")}}.</p> + +<h2 id="Syntaxe">Syntaxe</h2> + +<pre class="syntaxbox"> <em>event</em> = new KeyboardEvent(<em>typeArg</em>, <em>KeyboardEventInit</em>);</pre> + +<h3 id="Valeurs">Valeurs</h3> + +<dl> + <dt><em>typeArg</em></dt> + <dd>Une représentation du nom de l'évènement sous forme de {{domxref("DOMString")}}.</dd> + <dt><em>KeyboardEventInit</em>{{optional_inline}}</dt> +</dl> + +<dl> + <dd>Un dictionnaire <code>KeyboardEventInit</code> ayant les champs suivants : + + <ul> + <li><code>"key"</code>, optionnel et par défaut <code>""</code>, de type {{domxref("DOMString")}}, qui définit la valeur de {{domxref("KeyboardEvent.key")}}.</li> + <li><code>"code"</code>, optionnel et par défaut <code>""</code>, de type {{domxref("DOMString")}}, qui définit la valeur de {{domxref("KeyboardEvent.code")}}.</li> + <li><code>"location"</code>, optionnel et par défaut <code>0</code>, de type <code>unsigned long</code>, qui définit la valeur de {{domxref("KeyboardEvent.location")}}.</li> + <li><code>"ctrlKey"</code>, optionnel et par défaut <code>false</code>, de type {{jsxref("Boolean")}}, qui définit la valeur de {{domxref("KeyboardEvent.ctrlKey")}}.</li> + <li><code>"shiftKey"</code>, optionnel et par défaut <code>false</code>, de type {{jsxref("Boolean")}}, qui définit la valeur de {{domxref("KeyboardEvent.shiftKey")}}.</li> + <li><code>"altKey"</code>, optionnel et par défaut <code>false</code>, de type {{jsxref("Boolean")}}, qui définit la valeur de {{domxref("KeyboardEvent.altKey")}}.</li> + <li><code>"metaKey"</code>, optionnel et par défaut <code>false</code>, de type {{jsxref("Boolean")}}, qui définit la valeur de {{domxref("KeyboardEvent.metaKey")}}.</li> + <li><code>"repeat"</code>, optionnel et par défaut <code>false</code>, de type {{jsxref("Boolean")}}, qui définit la valeur de {{domxref("KeyboardEvent.repeat")}}.</li> + <li><code>"isComposing"</code>, optionnel et par défaut <code>false</code>, de type {{jsxref("Boolean")}}, qui définit la valeur de {{domxref("KeyboardEvent.isComposing")}}.</li> + <li><code>"charCode"</code>, optionnel et par défaut <code>0</code>, de type <code>unsigned long</code>, qui définit la valeur du déprécié {{domxref("KeyboardEvent.charCode")}}.</li> + <li><code>"keyCode"</code>, optionnel et par défaut <code>0</code>, de type <code>unsigned long</code>, qui définit la valeur du déprécié {{domxref("KeyboardEvent.keyCode")}}.</li> + <li><code>"which"</code>, optionnel et par défaut <code>0</code>, de type <code>unsigned long</code>, qui définit la valeur du déprécié {{domxref("KeyboardEvent.which")}}.</li> + </ul> + + <div class="note"> + <p><em>Le dictionnaire <code>KeyboardEventInit</code></em><em> accepte aussi les champs des dictionnaires {{domxref("UIEvent.UIEvent", "UIEventInit")}} et {{domxref("Event.Event", "EventInit")}}.</em></p> + </div> + </dd> +</dl> + +<h2 id="Specifications" name="Specifications">Spécifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Spécification</th> + <th scope="col">Statut</th> + <th scope="col">Commentaire</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('UI Events','#interface-keyboardevent','KeyboardEvent()')}}</td> + <td>{{Spec2('UI Events')}}</td> + <td>Définition actuelle.</td> + </tr> + <tr> + <td>{{SpecName('DOM3 Events','#interface-KeyboardEvent','KeyboardEvent()')}}</td> + <td>{{Spec2('DOM3 Events')}}</td> + <td>Définition initiale.</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + + + +<p>{{Compat("api.KeyboardEvent.KeyboardEvent")}}</p> + +<h2 id="Voir_aussi">Voir aussi</h2> + +<ul> + <li>{{domxref("KeyboardEvent")}}, l'interface des objets qu'il construit.</li> +</ul> |