Bonjour,
Comme beaucoup j'essaie (en vain) de réaliser un petit WYSIWYG simple et qui produit du code correct.
J'ai essayé beaucoup de méthodes qui ne me conviennent vraiment pas (comme l'execCommand par exemple qui ne produit pas la même chose sur tous les navigateurs...)
Je ne suis pas expert en javascript, mais j'aime bien bricoler avec, du coup:
à partir d'un iframe ou d'une div j'aimerai faire une sélection, que je puisse récupérer cette sélection et la remplacer par un code de mon choix.
Ce que j'arrive très bien à faire dans un textarea et que je n'arrive pas à transposer pour une div ou iframe...
Pour mon textarea j'ai ceci et ça marche très bien:
Du coup pour réaliser la même chose dans un div ou iframe je galère:
Ce qui me permet donc de récupérer la sélection, je sui sallé plus loin en permettant un remplacement de la chaine dans le div, mais ça me remplace pas cette chaine précisément mais celle qui est rencontré en premier dans le div.
Ex: Admettons que j'ai ce texte dans une div: Bonjour je suis content!
Et que je veuille mettre en gras le "j" de "je", dans ce que j'ai réalisé il me remplace le premier "j" qu'il rencontre c'est à dire le "j" de "Bonjour"...
C'est pourquoi je reviens au code ci-dessus récupérant la sélection et j'aimerai récupérer via celle-ci le début de la sélection, sa longueur et la fin de la sélection... pour réinjecter une chaine remplaçante au même endroit...
Quelqu'un pourrait-il m'aider?
Comme beaucoup j'essaie (en vain) de réaliser un petit WYSIWYG simple et qui produit du code correct.
J'ai essayé beaucoup de méthodes qui ne me conviennent vraiment pas (comme l'execCommand par exemple qui ne produit pas la même chose sur tous les navigateurs...)
Je ne suis pas expert en javascript, mais j'aime bien bricoler avec, du coup:
à partir d'un iframe ou d'une div j'aimerai faire une sélection, que je puisse récupérer cette sélection et la remplacer par un code de mon choix.
Ce que j'arrive très bien à faire dans un textarea et que je n'arrive pas à transposer pour une div ou iframe...
Pour mon textarea j'ai ceci et ça marche très bien:
<script type="text/javascript">
//<![CDATA[
function formatText(Texte,tag){
var selectedText = document.selection?document.selection.createRange().text:Texte.value.substring(Texte.selectionStart,Texte.selectionEnd);// IE:Moz
if(tag=='b') {var newText= "<strong>" + selectedText + "</strong>";}
if(document.selection){document.selection.createRange().text=newText;}//IE
else{Texte.value=Texte.value.substring(0,Texte.selectionStart)+newText+Texte.value.substring(Texte.selectionEnd,Texte.value.length);}
}//Moz
//]]>
</script>
<input type="button" value="Gras" onclick="formatText(content,'b');" />
<textarea name="content" id="content" ></textarea>
Du coup pour réaliser la même chose dans un div ou iframe je galère:
<script type="text/javascript">
function getSelectedText(){
if (window.getSelection){
var str = window.getSelection();
}else if (document.getSelection){
var str = document.getSelection();
}else {
var str = document.selection.createRange().text;
}
return str;
}
function affichage(){
var sel = getSelectedText();
alert(sel);
}
</script>
</head>
<body>
<div id="lala">Du texte à sélectionner dans la page</div>
<p><input type="button" onClick="affichage()" value="Afficher la sélection" /></p>Ce qui me permet donc de récupérer la sélection, je sui sallé plus loin en permettant un remplacement de la chaine dans le div, mais ça me remplace pas cette chaine précisément mais celle qui est rencontré en premier dans le div.
Ex: Admettons que j'ai ce texte dans une div: Bonjour je suis content!
Et que je veuille mettre en gras le "j" de "je", dans ce que j'ai réalisé il me remplace le premier "j" qu'il rencontre c'est à dire le "j" de "Bonjour"...
C'est pourquoi je reviens au code ci-dessus récupérant la sélection et j'aimerai récupérer via celle-ci le début de la sélection, sa longueur et la fin de la sélection... pour réinjecter une chaine remplaçante au même endroit...
Quelqu'un pourrait-il m'aider?
).