begin process at 2012 05 29 00:37:04
  Trouver un code source :
 
dans
 
[ Dernières recherches ]
Accueil > Forum > 

Javascript / DHTML / Ajax

 > 

JavaScript Orienté objet (POO)

 > 

Function & Méthodes

 > 

BBCode

Derniers messages déposésPoser une question dans le forum ou lancer une discussion

BBCode

mercredi 6 juin 2007 à 11:03:14 | BBCode

Gourou34

Alors voià, ca fait un bout de temps que je me penche sur ce sujet mais n'étant que débutant en matière de Javascript, je n'arrive pas à réaliser mon BBcode.
J'ai un formulaire dans lequel je voudrai pouvoir donner la possiblité aux utilisateurs de poster des commentaires mis en forme avec des balises créées en cliquant sur un bouton.
Ex : l'ulisateur sélectionne le texte et veut le mettre en gras, il clique sur le bouton B et le texte sélectionné se met entre les balises <b></b>.

Voilà mon formulaire :

<form name="ajout" action="ma page ou est dirigée l'info" method="post">

Titre : <input type="text" name="titre" size="50"><br>

Mon BBcode avec les balises Gras "G", Italique "I" ... qui appelent une fonction pour mettre en forme le texte à chaque sélection de texte :
<input type="button" value="G" class="gras" name="Gras" onClick="gras();">
<input type="button" value="I" class="italic" name="Italique" onClick="italic()">
<input type="button" value="S" class="souligne" name="Souligne" onClick="souligne()">
<input type="button" value="Lien" class="lien" name="Lien" onClick="lien()"><br>
<input type="button" value="Gauche" class="fondgris" name="Gauche" onClick="gauche()">
<input type="button" value="Centre" class="fondgris" name="Centre" onClick="centre()">
<input type="button" value="Droite" class="fondgris" name="Droite" onClick="droite()">

Ma zone de texte :
<textarea cols="62" rows="15" name="texte"></textarea>
<input type="submit" value="Ajouter l'info !">

</form>

Merci d'avance pour votre aide .
mercredi 6 juin 2007 à 11:06:44 | Re : BBCode

coucou747

Administrateur CodeS-SourceS
Salut
<html>
<head>
<title>BB-CODE séléction</title>
</head>
<body>
<textarea id="texte"></textarea>
<input type="button" value="get selection"
onclick="alert(cform.value.substr(cform.selectionStart,(cform.selectionEnd-cform.selectionStart)))" />
<input type="button" onclick="Addurl();" value="ajouter lien" />
<script type="text/javascript">
	cform=document.getElementById('texte');
	function Addurl(){
		cform.value = cform.value.substr(0,cform.selectionStart) +
		'[URL ' + prompt('URL : ','http://')+']' +
		cform.value.substr(cform.selectionStart,(cform.selectionEnd-cform.selectionStart)) +
		'[/URL]' +
		cform.value.substr(cform.selectionEnd, cform.lenght - cform.selectionEnd);
	}
</script>
</body>
</html>
voila, t'as un exemple adaptable


une recherche sur exalead vous aurait peut-etre evite de poser cette question
In a dream, I saw me, drop dead...
U were there, U cried...
It was just a dream,
if I die, U won't cry, maybe, U'll be happy
mercredi 6 juin 2007 à 11:16:23 | Re : BBCode

yousfane
Salut
[ Lien ]
mercredi 6 juin 2007 à 11:19:04 | Re : BBCode

Gourou34
Bonjour coucou747,

Ton exemple ne m'apporte pas plus d'infos sur la façon d'ajouter des balises telles que <b></b>, <i></i> autour du texte sélectionné lorsque je clique sur mon bouton B,I ...
Il me dit juste la façon d'ajouter un lien dans mon formulaire avec un message prédéfini dans le prompteur .

Merci quand même pour ton aide qui ne m'aide pas beaucoup sur la fonction gras(), italic(), ...
mercredi 6 juin 2007 à 11:21:33 | Re : BBCode

bultez

Membre Club




Bonjour,

PetOleTeam a fait : http://www.javascriptfr.com/codes/CURSEUR-DANS-TEXTAREA_39612.aspx
    et c'est superbe.

mais pourquoi encore faire du BBCode, alors qu'une foultitude de
    saisie WYSIWIG sont disponibles ? c'est beaucoup plus agréable !
    un ch'tit exemple ?
         http://www.javascriptfr.com/codes/MISE-FORME-TEXTE-SAISIE-WYSIWYG_32583.aspx
    c'est le mien, mais il y en a d'autres, ne serait-ce que celui de CodesSources.. et ailleurs aussi.
Cordialement                Bul     [mon Site]     [M'écrire]


mercredi 6 juin 2007 à 11:22:46 | Re : BBCode

coucou747

Administrateur CodeS-SourceS
Salut

....
alors la j'y crois pas....

t'as 
	function Addurl(){
		cform.value = cform.value.substr(0,cform.selectionStart) +
		'[URL ' + prompt('URL : ','http://')+']' +
		cform.value.substr(cform.selectionStart,(cform.selectionEnd-cform.selectionStart)) +
		'[/URL]' +
		cform.value.substr(cform.selectionEnd, cform.lenght - cform.selectionEnd);
	}
ce qui t'indique CLAIREMENT comment recuperer les parties selectionnees, les parties avant et apres...

	function Gras(){
		cform.value = cform.value.substr(0,cform.selectionStart) +
		'[b]' +
		cform.value.substr(cform.selectionStart,(cform.selectionEnd-cform.selectionStart)) +
		'[/b]' +
		cform.value.substr(cform.selectionEnd, cform.lenght - cform.selectionEnd);
	}
j'ai change beaucoup de choses ???

une recherche sur exalead vous aurait peut-etre evite de poser cette question
In a dream, I saw me, drop dead...
U were there, U cried...
It was just a dream,
if I die, U won't cry, maybe, U'll be happy
mercredi 6 juin 2007 à 11:28:17 | Re : BBCode

coucou747

Administrateur CodeS-SourceS
bultez,

tu as tape 16 snippets, (j'ai reregarde pour l'ocasion, mais je savais que t'en avais fait), t'aimes bien leur interface wysiwyg pour poster ta source ? c'est super agreable de colorer manuellement...

T'as un monde entre latex et word, pour ne citer que les meilleurs de chaque monde, dans le monde du web, BBcode serait l'equivalent de latex, et word des wysiwygs, certains wysiwygs sont tres bien, mais peu permettent de poster un code colore facilement, de pouvoir editer facilement ce code, de pouvoir ajouter des equations mathematiques, de pouvoir [...] T'as du bon dans les deux mondes, mais le wysiwyg ne peut pas plaire a tout le monde (sur mon site, j'avais les code les deux modes d'editions), enfin tu comprends bien qu'editer son code source comme ca, le reprendre quelques temps apres, l'avoir colore en ligne :) c'est du bonheur... apres, c'est sur que repondre sur un forum avec un wysiwyg, c'est tout aussi bon, mais pour une autre application...

une recherche sur exalead vous aurait peut-etre evite de poser cette question
In a dream, I saw me, drop dead...
U were there, U cried...
It was just a dream,
if I die, U won't cry, maybe, U'll be happy
mercredi 6 juin 2007 à 11:36:11 | Re : BBCode

bultez

Membre Club
>>dans le monde du web, BBcode serait l'equivalent de latex, et word des wysiwygs
 >>le wysiwyg ne peut pas plaire a tout le monde
    certes. c'était juste une info pour notre Gourou, au cas où il ne connaitrait pas...
Cordialement            Bul     [mon Site]     [M'écrire]


mercredi 6 juin 2007 à 11:44:54 | Re : BBCode

Gourou34

Alors je réexplique mon souci.
J'ai essayé de prendre la valeur sélectionnée par l'utilisateur :

 <script language="javascript">
 function gras()
 {
        sel = document.selection.createRange().text;
        sel = '<b>'+sel+'</b>';
        alert(sel);
 }
 </script>

L' alert(sel); retourne <b></b> avec le texte sélectionné à l'intérieur comme je voulais qu'il apparaisse tout simplement dans ma balise mais je n'arrive justement pas à le réafficher dans ma zone textearea.

C'est jsute ce que je voulais au fond !
Pouvez vous m'aider sur ce problème ?
mercredi 6 juin 2007 à 11:46:43 | Re : BBCode

yousfane
Réponse acceptée !
Salut
voici un script qui va t'aider
[ Lien ]

1 2 3

Cette discussion est classée dans : texte, gras, onclick, balises, bbcode

Répondre à ce message

Sujets en rapport avec ce message

replace plusieurs fois [ par cirdec2000 ] voila j'ai une variable texte dans laquelle je veux remplacer mes balises par des espacesvarTexte="|[Taille 1]|[Gras]MAIRIE [/Gras]|DE |[Taille 3] SAI Petit traitement de texte personalisé [ par Dominique49 ] Bonjour à tous, voilà, je voudrais faire un petit traitement de texte en ligne personnalisé. Ce serait faisable en Java, mais tout le monde n'a pas Ja IE8 onclick de la div ne fonctionne que sur le texte [ par rhan_659 ] Bonjour j'ai un petit souci avec IE8 (et certainement les autres ie) et bien sur pas de souci avec FF. j'ai des div avec un onclick="foo();" hors le Inserer du texte entre 2 balises DIV [ par DAN1 ] Bonjour à tous. En JavaScript j'essaie d'insérer du texte entre deux balises DIV. Voici mon code : <!-- // met automatiquement la légende de la Cohabitation OnMouseOut et OnClick [ par Batavia ] Bonjour,voilà j'ai conçu mon site en php avec des pseudo frames.Dans une partie menu, à l'aide du script suivant :function ChangeMessage(message,champ Image qui agi sur un champ texte [ par sagaff ] Bonjours,J'aimerai que lorsque je clique sur une image ,ca agissent sur un champ texte.Je suis entrai nde faire un script de news, donc quand je cliqu Insérer un texte en gras dans un texe en italique dans une textarea [ par cartman22 ] salut a tous. Voila j'ai un petit probleme, j'ai un formulaire simple composé de trois boutons et d'une textarea. les trois bouton correspondent à : m onclick sur un texte [ par dafrey ] Bonjour, J'aimerais faire un onclick sur du texte mais sans que le curseur de la souris se change en barre d'insertion de texte... Si vous avez une so onClick [ par aquouel ] Bonjour tout le monde, je débute dans le javascript depuis peu, et j'aimerai savoir si quand on clique sur un bouton d'un formulaire (qui utilise onC Ballises dans un textarea [ par bonjovi51 ] Slt, Je voudrai savoir comment placer des balises HTML, genre ou dans un textarea grâce à des checkbox. Je veux que ce soit comme dans un forum, en


Nos sponsors


Sondage...

CalendriCode

Mai 2012
LMMJVSD
 123456
78910111213
14151617181920
21222324252627
28293031   

Consulter la suite du CalendriCode

Photothèque

Photo Frau auf Feld mit KopfsalatPhoto Underwater
Photo Sea sponges and water surface 

Visiter la photothèque

A découvrir
 
Développement réalisé par Nicolas SOREL (Nix) avec l'aide de : Cyril DURAND et Emmanuel (EBArtSoft), Merci à Vincent pour ses précieux conseils.
CodeS-SourceS.com© Toute reproduction même partielle est interdite sauf accord écrit du Webmaster
CodeS-SourceS.com© est une marque déposée tous droits réservés

Google Coop CodeS-SourceS Google Coop CodeS-SourceS
Temps d'éxécution de la page : 0,983 sec (3)

Nous contacter | Annoncer sur CodeS-SourceS | Mentions légales
Outils Convertisseur VB/C# Snippets et scripts Outils en ligne La ToolBox
Communauté Programmation Photographie Technologie Newsgroups Emploi Forum Blogs
Guide d'achat Téléphonie mobile Image et son Informatique Bureautique Jeux vidéo
Logiciels Internet & Réseau Développement Market Android Jeux & Loisirs Graphisme Multimédia Sécurité Pilotes
Loisirs Cartes virtuelles Vidéos droles Jeux en ligne Géoguide AndroLib (Android Market)