Cela faisait un bout de temps que je cherchais une fonction javascript qui permettrait d'éditer du code dans un textarea. En fréquentant ce soir wikipedia, je me suis aperçu qu'ils avaient fait la chose en retravaillant un code de phpBB.

Copiez-collez le code ci-dessous dans votre éditeur de texte et enregistrez le fichier sous le nom js.html par exemple. Puis, de votre navigateur, lancez-le. Tapez du texte et sélectionnez-en une partie. cliquez ensuite sur un des liens au dessus de la boîte.
On peut facilement ajouter ce code au Wikini, au Jobinote, etc. Je pense qu'il serait judicieux de l'incoporer immédiatement à toutes les fois que l'élève ou l'enseignant doit entrer du texte.

Gilles

<script>

function escapeQuotes(text) {

	text=text.replace(/'/g,"\\'");
	text=text.replace(/\n/g,"\\n");
	return text;
}

// apply tagOpen/tagClose to selection in textarea,
// use sampleText instead of selection if there is none
// copied and adapted from phpBB
function insertTags(tagOpen, tagClose, sampleText) {

    var txtarea = document.ggj.mytxt;
	// IE
	if(document.selection) {
		var theSelection = document.selection.createRange().text;
		if(!theSelection) { theSelection=sampleText;}
		txtarea.focus();
		if(theSelection.charAt(theSelection.length - 1) == " "){// exclude ending space char, if any
			theSelection = theSelection.substring(0, theSelection.length - 1);
			document.selection.createRange().text = tagOpen + theSelection + tagClose + " ";
		} else {
			document.selection.createRange().text = tagOpen + theSelection + tagClose;
		}
	// Mozilla
	} else if(txtarea.selectionStart || txtarea.selectionStart == '0') {
 		var startPos = txtarea.selectionStart;
		var endPos = txtarea.selectionEnd;
		var myText = (txtarea.value).substring(startPos, endPos);
		if(!myText) { myText=sampleText;}
		if(myText.charAt(myText.length - 1) == " "){ // exclude ending space char, if any
			subst = tagOpen + myText.substring(0, (myText.length - 1)) + tagClose + " "; 
		} else {
			subst = tagOpen + myText + tagClose; 
		}
		txtarea.value = txtarea.value.substring(0, startPos) + subst + txtarea.value.substring(endPos, txtarea.value.length);
		txtarea.focus();
		var cPos=startPos+(tagOpen.length+myText.length+tagClose.length);
		txtarea.selectionStart=cPos;
		txtarea.selectionEnd=cPos;
	// All others
	} else {
		// Append at the end: Some people find that annoying
		//txtarea.value += tagOpen + sampleText + tagClose;
		//txtarea.focus();
		tagOpen=tagOpen.replace(/\n/g,"");
		tagClose=tagClose.replace(/\n/g,"");
		document.infoform.infobox.value=tagOpen+sampleText+tagClose;
		txtarea.focus();
	}
	// reposition cursor if possible
	if (txtarea.createTextRange) txtarea.caretPos = document.selection.createRange().duplicate();
}

</script>


<form name='ggj'>

    <a href='#' onclick='insertTags("<b>","</b>","")'>Gras</a> | 
    <a href='#' onclick='insertTags("<i>","</i>","")'>Italique</a> |
    <a href='#' onclick='insertTags("#R#","#R#","Rouge")'>Rouge</a> |<a href='#' onclick='insertTags("----","","")'>Ligne Horizontale</a>  <p>

    <textarea name='mytxt' cols=40 rows=20></textarea>

    
    


</form>
Il n'y a pas de commentaire sur cette page. [Afficher commentaires/formulaire]
 
IMP :: RSS :: HTML :: TXT :: Clone :: Historique :: Propriétaire : GillesJobin