Problème WYSIWYG avec Opera et fonction Contenteditable.

Bonjour. j'ai un petit problème, je dévloppe un widget pour Opera 9.x dans le but de faire un éditeur WYSIWIG. Il y a peu, j'ai découvert la fonction ContentEditable qui permet d'en avoir un "tout fait" compatible Opera (il supporte cette fonction depuis sa version 9.0 beta). J'avais donc déssidé de me basé sur cette fonction pour dévloppé mon widgets. Étant donné que la fonction ContentEditable interprète directement le HTML dans un "champ de texte", il est très facile de rajouté des fonctions comme mettre de la couleur ou autre avec un petit code Javascript. Dans tout éditeur WYSIWYG qui se respècte, on sélectionne du texte et on choisit une couleur a lui donner. Il colore donc le texte que l'on as selectionné. J'ai donc cherché comment faire pour faire cela, mon attention s'est donc portée sur un script qui perméttait de savoir le texte que l'on avais selectionné. Il sufisais donc d'éffacé la selection et de rajouté des balises autour de la selection pour mettre de la couleur. J'ai donc réalisé quelques tests avec ces fonctions assez utile, ça m'avais l'air assez concluant. Mais au moment de l'intégré a mon éditeur WYSIWYG, un problème est survenue; La fonction ne marche pas si la fonction contenteditable est présente dans la page. Je ne trouve donc absolument pas comment faire, voici le code que j'avais tapé pour faire mon éditeur WYSIWYG. Si vous connaissez une autre fonction perméttant de connaître le contenu de la selection, merci de me la communiquée. [code] Rouge
Balise de début de rougeBalise de fin de rouge [/code] Merci d'avance pour vos réponses.

Arf, le forum as interprété mon code HTML, voici le code non interprété : <script> function Selection () { copy = document.selection.createRange().text; if(copy == "" ) { document.getElementById('WYSIWYG').innerHTML="<div style='color:red;'>Rouge</div>"; } else { document.getElementById('WYSIWYG').innerHTML="<div style='color:red;'>"+copy+"</div>"; } } </script> <a href='javascript:Selection();'>Rouge</a><br /> <BUTTON onclick='WYSIWYG.innerHTML+="<div style=\"color:red;\">texte"'>Balise de début de rouge</BUTTON> <BUTTON onclick='WYSIWYG.innerHTML+="</div> <br />"'>Balise de fin de rouge</BUTTON> <div id="WYSIWYG" style="border-style: double;" contenteditable>texte</div>

Il semble qu'il y ai un légé blem de compatibilitée entre le forum et Opera, néamoins, voici le code non interprété avec sauts de lignes... <script>
function Selection ()
{
copy = document.selection.createRange().text;
if(copy == "" )
{
document.getElementById('WYSIWYG').innerHTML="<div style='color:red;'>Rouge</div>";
}
else
{
document.getElementById('WYSIWYG').innerHTML="<div style='color:red;'>"+copy+"</div>";
}
}
</script>
<a href='javascript:Selection();'>Rouge</a><br /> <BUTTON onclick='WYSIWYG.innerHTML+="<div style=\"color:red;\">texte"'>Balise de début de rouge</BUTTON> <BUTTON onclick='WYSIWYG.innerHTML+="</div> <br />"'>Balise de fin de rouge</BUTTON> <div id="WYSIWYG" style="border-style: double;" contenteditable>texte</div>

bonjour,

   on ne voit pas ton code.
   connaitre le contenu de la sélection, il y a plusieurs
      exemple compatible FF,IE ici même,
      mais opera ? montre nous ( puisqu'on ne voit pas ! )
      on te dira si c'est ok avec FF, IE, tant à Opera ?
  ( passe par un éditeur de texte pour mettre ton code )  

cordialement   Bul     Site      M'écrire

ah... on voit mieux...
ce que tu utilise est exclusif IE.
avec le Renard de Feu : un truc comme ça :
   element.value.substring(element.selectionStart,element.selectionEnd);
   ( ou pas loin )
à tester donc avec Opera.
cordialement   Bul    Site    M'écrire

Bonjour, bultez.

Le forum est très peu compatible avec Opera en mode "textbox evolué". C'est pourquoi il as interprété mon HTML & cie.

Ce code n'est pas prévu pour être compatible Firefox qui ne gère pas la fonction ContentEditable. Il est prévu pour être un éditeur WYSIWYG en widget pour Opera 9.x.

Revoici le code qui ne sera je l'espère pas interprété par le forum.
-----------------------------------------------------------------------------
&lt;script&gt;
function Selection ()
{
copy = document.selection.createRange().text;
if(copy == &quot;&quot; )
{
document.getElementById('WYSIWYG').innerHTML=&quot;&lt;div style='color:red;'&gt;Rouge&lt;/div&gt;&quot;;
}
else
{
document.getElementById('WYSIWYG').innerHTML=&quot;&lt;div style='color:red;'&gt;&quot;+copy+&quot;&lt;/div&gt;&quot;;
}
}
&lt;/script&gt;

&lt;a href='javascript:Selection();'&gt;Rouge&lt;/a&gt;&lt;br /&gt;

&lt;BUTTON onclick='WYSIWYG.innerHTML+=&quot;&lt;div style=\&quot;color:red;\&quot;&gt;texte&quot;'&gt;Balise de d&Atilde;&copy;but de rouge&lt;/BUTTON&gt;
&lt;BUTTON onclick='WYSIWYG.innerHTML+=&quot;&lt;/div&gt; &lt;br /&gt;&quot;'&gt;Balise de fin de rouge&lt;/BUTTON&gt;


&lt;div id=&quot;WYSIWYG&quot; style=&quot;border-style: double;&quot; contenteditable&gt;texte&lt;/div&gt;

-----------------------------------------------------------------------------

Il ne marche pas sous Opera 9.0, le script n'arrive pas a determiné quel texte nous avons selectionné quand la fonction Contenteditable est active, si elle n'est pas dans le code, il arrive très bien a savoir ce que l'on as selectionné.

Ces deux fonctions ne peuvents aparement pas êtres dans la même page, en connaissez vous une alternative pour faire ce que je veux faire?

desoler j'ai répondu pendant que vous répondiez, non non ce n'est pas exclusif IE, ContentEditable foncionne très bien sous Opera 9 ;)

précision : à la place de createRange
pas regardé le reste.
cordialement   Bul    Site    M'écrire

rien à faire...
je crains que l'on ne  se croise jusqu'au bout....
pour la compatibilité de parlais de createRange qui est exclusif IE (je crois)
cordialement   Bul     Site      M'écrire

heu, le code pour connaître la selection fonctionne très bien sous opera en temps normlal, mais quand on met <div contenteditable>texte</div> qui permet de faire une sorte d'éditeur WYSIWYG, la fonction ne marche plus...