Bonjour à tous,

Je suis entrain de développer un éditeur HTML WYSIWYG qui fonctionne bien en ce qui concerne la mise en forme du texte (j'utilise la fonction execCommand() ).
Par contre pour améliorer l'ergonomie de mon éditeur je voudrais faire en sorte que lorsque mon curseur (texte) se trouve dans une zone, par exemple en gras, le bouton associé soit "actif".

Pour mieux comprendre voici l'extrait du script HTML issue de l'éditeur avec un bout de texte en gras :
Code : Sélectionner tout - Visualiser dans une fenêtre à part
<p>Texte normal Texte normal <b>Texte en GRAS</b> Texte normal</p>
J'ai essayée la fonction queryCommandValue() mais sans résultat (j'arrive pas bien à comprendre où et comment l'utiliser).

Le seul code JavaScript qui fonctionne même s'il répond qu'a moitié mon problème est celui-ci :
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
 
document.getElementById('editeur').addEventListener('focus', function (e) { // enclenche la recherche des balises <b> contenue dans le message
    var b_Elts = document.getElementsByTagName('b');
 
     for (var i = 0; i < b_Elts.length; ++i) {
        b_Elts[i].addEventListener('click', function (e) {  // événement qui ajoute une classe actif au bouton associé au GRAS
            document.getElementById('boldSwitch').classList.add('actif');
        });
    }
 
});
Il répond qu'a moitié a mon problème car il déclenche la fonction qui me permet de changer le style du bouton que si je "click" dessus.
En gros mon problème c'est que je n'arrive pas a ajouter un évènement de type clavier a ma balise <b>, seul l'évènement click à l'aire de se déclencher.
j'ai essayé "focus", "keypress", "keyup", "keydown" mais rien y fait, l'évènement ne se déclenche pas.

Si vous avez une idée pour résoudre mon problème je vous remercie d'avance.

PS: Inutile de me proposer ceux qui sont déjà fait, qui fonctionne très bien fait et simple d'utilisation, mon but est surtout d'apprendre.

Merci encore