Comment faire pour que le curseur texte n'appartienne pas/plus à la balise précédente ?

Salut,

Dans le cas où j'écris dans un élément éditable (c'est-à-dire avec contenteditable="true" ) comment faire pour que le curseur texte n'appartienne pas/plus à la balise précédente (par exemple lorsqu'il est placé par la souris après le caractère ">" ou que je fais ctrl + m comme dans openOffice) ? Je m'explique : par exemple si on a :

Code:

---

ceci est un exemple

---

correspondant à :

Code:

---

ceci est un <b>exemple</b>

---

Si je veux rajouter un "s" au mot exemple pendant que j'écris il est normal* que j'obtienne ça :

Code:

---

ceci est un exemples

---

car bien que le curseur texte se déplace à chaque frappe sur le clavier il appartient toujours à la balise <b>.

1 ---> Mais si je veux écrire du texte après le mot "exemple" et que je ne veuille pas que ce texte soit en gras (c'est-à-dire je ne veux pas qu'il appartienne à la balise précédent le curseur), comment faire cela ? (on obtient cela en tapant ctrl + m dans openOffice)

2 ---> Si, avec un clique de souris, je place le curseur texte après le caractère ">" (qui se trouve après le mot "exemple") comment faire pour qu'il n'appartienne pas à la balise précédente ?

Merci.

* Mise à part la faute d'accord...

Bonjour,
je ne comprends pas ton soucis car c'est le comportement normal des éditeurs, donc autant le garder, et dans ce cas on annule après le début de la frappe la mise en forme en gras !

Le soucis c'est que c'est pénible parfois... Exemple : il m'est déjà arrivé plusieurs fois d’insérer un lien dans un texte et ne plus pouvoir écrire après (en dehors du lien) et ça m'arrive même dans l'éditeur de certains forums alors ce que je fais c'est que je vais dans le source code et je tape mon texte après la balise eh bien j'aimerais faire ça de manière automatique et d'ailleurs c'est un problème que j'avais autrefois dans openOffice mais par la suite j'ai découvert qu'on pouvait faire ctrl+m pour cela.

Mais sinon le problème se pose aussi quand on fait un colorateur syntaxique, exemple si j'ai :

<div>
<p>un paragraphe en exemple...</p>
encore du texte...
</div>

Je ne veux pas que le texte à l'intérieur ou à l'extérieur des balises ait le style des balises...

Imagine tu tapes la balise <p> et que le colorateur le transforme en <p> si après je tape du texte, je veux avoir "<p>un paragraphe..." et non "<p>un paragraphe..." et ce de manière automatique comme c'est le cas en général dans les éditeurs à coloration syntaxique.

---> autre cas tu tapes la balise <p> et le colorateur le transforme en <p>|</p> en plaçant le curseur à l'intérieur de la balise pour que tu puisses taper directement ton texte eh bien quand on tape ce texte il ne prend pas le style des balises...

Je ne sais pas si je suis clair...

c'est à toi en cour de frappe de faire le nécessaire.

ce n'est pas un problème de balise.

tu mélange deux chose l'édition de texte et la mise en forme de ce texte.

tu utilise visiblement un éditeur html pour éditer du code
hors un éditeur html est fait pour éditer du html avec toutes ces règles.

si tu veux faire un éditeur de code avec coloration syntaxique il te faut utilise une saisie simple de texte et en temps réel analyser ce code pour y mettre la coloration syntaxique il n'est ici pas question de balise.
le code source étant toujours du texte simple contrairement aux éditeur html dont la la source est du code html.

dans un cas tu tape du texte et avec l'éditeur tu le modifie à la volé pour produire du code html et ce que tu obtiens c'est du html
dans l'autre tu tape du texte et l'outil de l'affiche en couleur sans le modifier et donc au final tu obtiens du simple texte.


c'est toute la différence entre
http://www.cdolivet.com/editarea/ et http://www.tinymce.com/

A+JYT

Merci. Oui en effet je voulais utiliser un élément éditable (par exemple une div ou un pre ou...) pour faire un mini éditeur avec coloration syntaxique.

Mais le problème que je soulève existe même dans les éditeurs comme openOffice ou celui de ce forum ou même celui que tu donnes : http://www.tinymce.com/ si par exemple on insert un lien à la fin du texte eh bien on ne peut plus en sortir pour écrire du texte après mais là ils ont réglé le problème, je n'avais pas remarqué qu'il suffisait de taper sur la touche du clavier correspondant à la flèche pointant vers le bas pour sortir du lien (qui correspond bien à une balise).

Mais apparemment c'est une mauvaise idée d'utiliser un élément éditable ?

non ce n'est pas une mauvaise idéee

mais ce qu'il faut comprendre c'est que le textarea ne doit contenir que le texte
et non la coloration syntaxique

la solution créer un div qui va afficher le code coloré
et un textarea pour la saisie.

lorsque l'utilisateur relâche la touche tu calcule la coloration la plus adaptée et tu l'affiche dans le DIV.

pour finir tu place le textarea devant le div de façon à donner l'illusion que tu tape dans le div.

regarde le code de http://www.cdolivet.com/editarea/

A+JYT

Merci. Quand tu as écris "...tu place le textarea devant le div..." tu voulais dire "...derrière le div" ? Ou bien c'est bien devant le div mais dans ce cas le textarea devra avoir un fond transparent et une couleur légère et/ou une opacité faible, c'est bien ça ?

Si on utilise un élément éditable il me semble qu'on a pas besoin d'utiliser de textearea, non ?