Introduction

Installation

Questions fréquemment posées

Syntaxe, mots-clés et fonctions intégrées

Distribution standard

Implémentation de import

Interface avec le navigateur

Modules intégrés propres à Brython

Travailler avec Brython

Recettes

 

Evénements clavier

Les événements relatifs au clavier sont

input déclenché quand la valeur d'un élément <input> ou <textarea> est modifié, ou quand le contenu d'un élément contenteditable est modifié
keydownappui sur une touche quelconque du clavier
keypressappui sur une touche du clavier qui produit un caractère. Par exemple, quand on entre Ctrl+C au clavier, l'événement keypress n'est déclenché qu'au moment où on appuie sur C, alors que keydown est déclenché dès l'appui sur Ctrl
keyuprelâchement d'une touche enfoncée

Attributs de l'objet DOMEvent

L'instance de DOMEvent possède les attributs suivants

altKey
booléen, indique si la touche Alt (ou Option sur Mac) était enfoncée quand l'événement clavier a été déclenché

Cet attribut n'est pas disponible pour l'événement input

Il est normalement utilisé avec keypress, pour pouvoir tester si on a entré Alt+<key> ou seulement <key>

Exemple

Saisir du texte dans le champ ci-dessous, en appuyant ou pas sur la touche Alt

  

Code

from browser import document

def altKey(ev):
    document["traceAltKey"].text = f"altKey : {ev.altKey}"

document["altKey"].bind("keypress", altKey)

charCode
Le numéro de référence Unicode pour la touche

Cet attribut n'est utilisable que pour l'événement keypress

Example

Entrer du texte dans le champ ci-dessous. Notez qu'on lit le caractère par chr(ev.charCode)

  

Code

from browser import document

def keypress(ev):
    trace = document["traceCharCode"]
    char = chr(ev.charCode)
    trace.text = f"charCode : {ev.charCode}, character: {char}"

document["charCode"].bind("keypress", keypress)

ctrlKey
booléen, indique si la touche Ctrl était enfoncée quand l'événement clavier a été déclenché

Cet attribut n'est pas disponible pour l'événement input

Il est normalement utilisé avec keypress, pour pouvoir tester si on a entré Ctrl+<key> ou seulement <key>

Example

Saisir du texte dans le champ ci-dessous, en appuyant ou pas sur la touche Ctrl

  

Code

from browser import document

def keypress(ev):
    document["traceCtrlKey"].text = f"ctrlKey : {ev.ctrlKey}"
    ev.preventDefault()

document["ctrlKey"].bind("keypress", keypress)

Notez que ev.preventDefault() est appelé pour éviter le comportement par défaut associé à certains raccourcis clavier qui utilisent la touche Ctrl.

keyCode
un code numérique dépendant du système et de l'implémentation, caractérise la clé enfoncée

cette valeur est la même que les touches Alt, Ctrl ou majuscules soient enfoncées ou non

noter que le résultat n'est pas le même selon qu'on gère les événements keydown, keyup et keypress

Example

Saisissez du texte dans les champs de saisie ci-dessous. Notez que le caractère peut être lu par ch(ev.charCode) avec l'événement keypress

avec keydown

avec keypress   

avec keyup

Code

from browser import document

def keyCode(ev):
    trace = document["traceKeyCode"]
    trace.text = f"event: {ev.type}, keyCode: {ev.keyCode}"
    ev.stopPropagation()

document["keyCodeKeydown"].bind("keydown", keyCode)
document["keyCodeKeypress"].bind("keypress", keyCode)
document["keyCodeKeyup"].bind("keyup", keyCode)

shiftKey
booléen, indique si la touche Majuscule était enfoncée quand l'événement clavier a été déclenché

Cet attribut n'est pas disponible pour l'événement input

Il est normalement utilisé avec keypress, pour pouvoir tester si on a entré Shift+<key> ou seulement <key>

Example

Saisir du texte dans le champ ci-dessous, en appuyant ou pas sur la touche Majuscule

  

Code

from browser import document

def keypress(ev):
    document["traceShiftKey"].text = f'shiftKey : {ev.shiftKey}'

document["shiftKey"].bind("keypress", keypress)

which
un code numérique dépendant du système et de l'implémentation, caractérise la clé enfoncée

noter que le résultat n'est pas le même selon qu'on gère les événements keydown, keyup et keypress

Example

Saisir du texte dans les champs ci-dessous. Notez qu'on peut lire le caractère par chr(ev.which) avec l'événement keypress.

avec keydown

avec keypress

avec keyup

 

Code

from browser import document

trace = document["traceWhich"]

def which(ev):
    trace.html = f"event : {ev.type}<br> which : {ev.which}"
    if ev.type == "keypress":
        trace.html += f"<br>character : {chr(ev.which)}"

document["whichKeydown"].bind("keydown", which)
document["whichKeypress"].bind("keypress", which)
document["whichKeyup"].bind("keyup", which)