[Résolu] Ajouter la tabulation dans un élement en contenteditable

Bien le bonsoir !

J'ai un petit problème qui me paraît assez bête mais que je n'arrive pas à résoudre. j'ai un bloc en contenteditable tout simple comme ceci :

<div contenteditable>

</div>

Le problème c'est que la tabulation fait perdre le focus sur l’élément ciblé (comportement normal me direz vous). Savez vous comment faire pour que lorsque l'on appuie sur la touche tabulation, cela l'ajoute dans le contenu au lieu de perdre le focus ?

Merci d'avance
Modifié par earhater (11 Jan 2014 - 00:09)

humm, désolé, je l'ai compris a l'envers
Modifié par gc-nomade (11 Jan 2014 - 13:38)

Bonjour,

Je n'ai pas l'impression de perdre le focus en tabulant.
Exemple

Ou alors, tout comme Cyril, je n'ai rien compris (ce qui est tout à fait possible )
Modifié par 6l20 (12 Jan 2014 - 13:38)

il souhaite rendre possible l'ajout d'une tabulation dans le champ d’édition sans en sortir ni passer au suivant , petit défaut d'usage classique des zone d’édition dans les formulaires quand on a l'habitude de se servir de la touche tab a cet effet.

Le plus simple et ergonomique, à mon simple avis, est d'utiliser javascript, non pas pour court-circuité l'appuie sur la touche, mais en ajoutant un bouton qui l’insère la ou se trouve le curseur
++

Bien le bonsoir,

Si je vous prend votre exemple : http://dabblet.com/gist/8384068 , quand vous éditez le contenu et que vous appuyez sur tab, vous n'ajoutez pas une tabulation mais vous allez sur l’élément suivant (gc-nomade a compris ce que j'ai voulu dire). Alors comment ajouter une tabulation ? Si je prend une div et que je fais :

var element = document.querySelector("div");
element.innerHTML += "\t";

ça ne rajoute pas de tabulation dans ma div ...

Merci à vous
Modifié par 6l20 (12 Jan 2014 - 13:38)

Arg, effectivement je n'avais pas compris
Je ne crois pas que ce soit prévu pour, ce n'est pas, à proprement parler, un "éditeur de texte" me semble t-il.
Il y a peut-être moyen de rajouter ce type de fonctionnalité via JavaScript, je n'en ai pas la moindre idée, mais, comme le précise Simon, dans l'article que j'ai mis en lien sur l'exemple :

Simon a écrit :
Il faut confier cette gestion à un script complémentaire, tel que CKEditor ou en concevoir un sur mesure afin d'injecter dans le DOM le code source souhaité.

C'est peut-être plus simple que de générer une "usine à gaz", non ?

Vous savez, j'ai juste besoin de la tabulation et tu me dis d'envoyer ckeditor (qui compressé fait 100 Ko) alors que c'est justement injecter ça qui fait usine à gaz Sinon oui j'aurait pu installer itnymce ou autre. Mais si vous voulez que je soit plus clair, j'ai juste besoin de savoir inclure une tabulation dans un élément html. C'est d'ailleurs pour ça que je me suis placé dans le forum javascript. Sinon je peux ajouter 4   mais bon, on a une touche de tabulation c'est fait pour.

Merci d'avance pour vos réponses

Aller merci tout le monde j'ai trouvé mon bonheur sur cette page :
https://developer.mozilla.org/en/docs/Rich-Text_Editing_in_Mozilla#Resources

A la prochaine !
Modifié par earhater (11 Jan 2014 - 21:06)