tfe Homepage

08/07/2007

Les iframes sont nos amies

Sous ce titre provocateur se trouve une astuce que je viens de découvrir. Pour la plupart des développeurs Web, ce ne sera pas une grande découverte mais bon.

Je viens de tomber sur la page mozilla, décrivant l'implémentation du "Rich text editing". Pour résumer, il s'agit d'une <iframe id="prout"> avec un mode particulier.

test=document.getElementById("prout"); test.contentDocument.designMode="on";

Cette iframe peut voir son contenu changer dynamiquement...

test.contentDocument.open(); test.contentDocument.write("Prout"); test.contentDocument.close();

Jusqu'ici rien d'extraordinaire; Le  ou c'est bon, c'est qu'on peut utiliser des fonctions de mise en forme du texte. Par exemple

test.contentDocument.execCommand("bold",false,null);

Il vous suffit alors de créer des boutons au dessus de votre textarea appelant les fonctions de mises en forme et le tour est joué. Un petit exemple: ici. e€ noter toutefois que ce genre d'éléments n'est pas e  utiliser partout; il faut vérifier le bon balisage du formulaire lors de la validation.