L'éditeur JavaScript
Visiteur non-identifié | Identifiez-vous | Devenir membre
Code perdu ? | Combien de visiteurs sur votre site ?
Rechercher :
Page d'accueil
     Home Page

JavaScript
     Tous les scripts
     Proposer un script
     Recherche de script
     AJAX new!
     Cours de JavaScript
     Liste de discussion
     Forums

Services :
     CountUs
     myCircle

     Referencement
     Créat. de bannière

Trucs et astuces :
     HTML / CSS
     PHP / MySQL
     Réferencement
     Graph / Présentation
     Toutes les astuces
     Ajouter un article

MailingList :
101087 abonnés

Annuaire webmaster :      Hebergement web
     Referencement
     Sites webmasters
     XHTML - CSS2
     PHP
     Affiliation - Pub
     FAI

     Annuaire webmaster

Ressources pour webmasters :
     Kits graphiques

Plus :
     Comparateur de prix
     Foire aux questions
     Les membres
     Devenir annonceur
     Faire un lien
     Contact

Partenaire :
     Hebergement gratuit
     Le PHP facile
     Horoscope
     Comscripts
     WebmasterClub
     Activeartanima...
     Le village de ...
     L'écriteau
     Faro-dessing
     Images gifs an...
     Easy-script.com
     Création de site
     Netsources
     Créer son site...
     K i s s design
     Les autres
     Votre site ici ?


BBcode !

Script posté par :

@ NBF
Vous aussi, postez vos scripts en cliquant ici.


Description

Facile à utiliser, ce script insère du BBcode aux endroits appropriés demandés et voulus par l'utilisateur.


Compatibilité :

 FireFox : Toutes versions
 Mozilla : 1 et +
 Netscape Navigator : 1 et +
 Internet Explorer : 1 et +


Chiffres :

Date de création : 4/01/2005
Dernière modif : 3/02/2005
Visites de la page : 35223
Envois par mail : 485


Dernière modification du script :

Le 3/02/2005 : Les retours à la ligne ne posent plus de problème de positionement du curseur pour IE
>> Voir toutes les modifications effectuées sur ce script.


Exemple :





Le code :

Entre <HEAD> et </HEAD> :


Entre <BODY> et </BODY> :


Services email :

Je désire recevoir ce script par email
Je désire recevoir un email en cas de modification de ce script
Je désire m'abonner à la newsletter de l'éditeur JavaScript


Les annotations des visiteurs :

De KevBrok - le 06-01-2005
Pas mal mais sur IE ça marche juste sur la prmière ligne si tu est sur un autre ligne, ça met le curseur n'importe ou :S
De NoPseudo38 - le 15-01-2005
strlen() dans du javascript ?!?
:)
De pataouet - le 20-01-2005
J'ai fait un petit ajout pour prendre en compte les retours chariots sous IE.

Je vous mets juste la partie à modifier :

//[...]
oField.value = orig.substr(0,i) + "[" + selec+ "][/" + selec + "]" + orig.substr(i, oField.value.length);

//Partie modifiée

//Gestion des retours chariots sous IE
var temp = orig.substr(0,i);
var nbretour =0;
for (var cpt=0;cpt<temp.length;cpt=cpt+1)
{
if(temp.charAt(cpt)=="\n")
{
nbretour=nbretour+1;
}
}
//Prise en compte des retour chariots dans le placement du curseur
pos = i + 2 + selec.length - nbretour;

//Fin de la modif

//placer(document.forms['news'].elements['newst'], pos);
var r = oField.createTextRange();
//[...]
De toph_sic - le 02-02-2005
Le script ne fonctionne pas parfaitement sous netscape mais c'est ce que je cherchais. Merci bien
De htmlnavigat - le 08-06-2005
comment faire pour y mettre des couleurs?

MERCI D AVANCE
De jiop55 - le 20-08-2005
lol ya pas pour les couleurs...
De Pyrah - le 07-05-2006
Voilà j'ai eu aussi la légère erreur sous netscape, que j'ai réussi à corriger.
J'ai aussi créer trois autes fonctions légérement différente une pour entrer un lien ou une couleur, une pour rentrer une image et une pour supprimer toute mise en forme du texte.
Le script est le suivant :
dans le HEAD, les trois fonctions javascript

<script language="Javascript">
function storeCaret(ao_txtfield,as_mf){
var isIE = (document.all);
if(!isIE){
//mozilla
//recuperation du txt selectionné
oField = ao_txtfield;
oFieldValue = oField.value;
deb = oField.selectionStart;
fin = oField.selectionEnd;
Deb = oFieldValue.substring( 0 , oField.selectionStart );
Fin = oFieldValue.substring( oField.selectionEnd , oField.textLength );
Sel = oFieldValue.substring( oField.selectionStart ,oField.selectionEnd );
oField.value = Deb + '[' + as_mf + "]" + Sel + "[/" + as_mf + ']' + Fin;
oField.selectionStart = Deb.length;
tmps =Deb + '[' + as_mf+']' + Sel +"[/" + as_mf + ']'
oField.selectionEnd = tmps.length+2;
oField.setSelectionRange(Deb.length+as_mf.length+2,tmps.length-as_mf.length-3);
oField.focus();
}else{
//IE
var str = document.selection.createRange().text;
if (str.length>0){
//recuperation du txt selectionné
var select = document.selection.createRange();
select.text = '[' + as_mf + ']' + str + "[/" + as_mf + ']';
select.collapse();
select.select();
}else{
ao_txtfield.focus(ao_txtfield.caretPos);
ao_txtfield.focus(ao_txtfield.value.length);
ao_txtfield.caretPos = document.selection.createRange().duplicate();
var bidon = "%~%";
var original = ao_txtfield.value;
ao_txtfield.caretPos.text = bidon;
var i = ao_txtfield.value.search(bidon);
ao_txtfield.value = original.substr(0,i) + '[' + as_mf + "][/" + as_mf + ']' + original.substr(i, ao_txtfield.value.length);
var temp = original.substr(0,i);
var nbretour =0;
for (var cpt=0;cpt<temp.length;cpt=cpt+1){
if(temp.charAt(cpt)=="\n"){
nbretour=nbretour+1;
}
}
pos = i + 2 + as_mef.length - nbretour;
var r = oField.createTextRange();
var r = ao_txtfield.createTextRange();
r.moveStart('character', pos);
r.collapse();
r.select();
}
}
}
De Pyrah - le 07-05-2006
2e fonction javascript

function storeCaretValue(ao_txtfield,as_mf,as_url){
var isIE = (document.all);
if(!isIE){
//mozilla
//recuperation du txt selectionné
oField = ao_txtfield;
oFieldValue = oField.value;
deb = oField.selectionStart;
fin = oField.selectionEnd;
Deb = oFieldValue.substring( 0 , oField.selectionStart );
Fin = oFieldValue.substring( oField.selectionEnd , oField.textLength );
Sel = oFieldValue.substring( oField.selectionStart ,oField.selectionEnd );
oField.value = Deb + '[' + as_mf+'='+as_url+ '*'+as_mf+']' + Sel + '[/' + as_mf + ']' + Fin;
oField.selectionStart = Deb.length;
tmps =Deb + '[' + as_mf+'=' +as_url+ '*'+as_mf+']' + Sel +'[/' + as_mf + ']';
oField.selectionEnd = tmps.length+3;
oField.setSelectionRange(Deb.length+(as_mf.length*2)+as_url.length+4,tmps.length-as_mf.length-3);
oField.focus();
}else{
//IE
var str = document.selection.createRange().text;
if (str.length>0){
//recuperation du txt selectionné
var select = document.selection.createRange();
select.text = '[' + as_mf +'='+as_url+ '*'+as_mf+']' + str + '[/' + as_mf + ']';
select.collapse();
select.select();
}else{
ao_txtfield.focus(ao_txtfield.caretPos);
ao_txtfield.focus(ao_txtfield.value.length);
ao_txtfield.caretPos = document.selection.createRange().duplicate();
var bidon = "%~%";
var original = ao_txtfield.value;
ao_txtfield.caretPos.text = bidon;
var i = ao_txtfield.value.search(bidon);
ao_txtfield.value = original.substr(0,i) + '[' + as_mf +'='+as_url+ '*'+as_mf+'][/' + as_mf + ']' + original.substr(i, ao_txtfield.value.length);
var temp = original.substr(0,i);
var nbretour =0;
for (var cpt=0;cpt<temp.length;cpt=cpt+1){
if(temp.charAt(cpt)=="\n"){
nbretour=nbretour+1;
}
}
pos = i + 2 + as_mef.length - nbretour;
var r = oField.createTextRange();
var r = ao_txtfield.createTextRange();
r.moveStart('character', pos);
r.collapse();
r.select();
var r = ao_txtfield.createTextRange();
r.moveStart('character', pos);
r.collapse();
r.select();
}
}
}
De Pyrah - le 07-05-2006
3e fonction

function storeCaretIMG(ao_txtfield,as_mf,as_url,ab_img){
var isIE = (document.all);
if(!isIE){
//mozilla
//recuperation du txt selectionné
oField = ao_txtfield;
oFieldValue = oField.value;
deb = oField.selectionStart;
fin = oField.selectionEnd;
Deb = oFieldValue.substring( 0 , oField.selectionStart );
Fin = oFieldValue.substring( oField.selectionEnd , oField.textLength );
Sel = oFieldValue.substring( oField.selectionStart ,oField.selectionEnd );
oField.value = Deb + '[' + as_mf +'='+as_url+ '*]' + Sel + Fin;
tmps =Deb + '[' + as_mf +'='+as_url+ '*]';
oField.selectionStart = tmps.length;
tmps =Deb +'['+ as_mf+'='+as_url+'*]'+Sel;
oField.selectionEnd = tmps.length;
oField.setSelectionRange(Deb.length+as_mf.length+4,tmps.length);
oField.focus();
}else{
//IE
var str = document.selection.createRange().text;
if (str.length>0){
//recuperation du txt selectionné
var select = document.selection.createRange();
select.text = '[' + as_mf +'='+as_url+ '*]' + str;
select.collapse();
select.select();
}else{
ao_txtfield.focus(ao_txtfield.caretPos);
ao_txtfield.focus(ao_txtfield.value.length);
ao_txtfield.caretPos = document.selection.createRange().duplicate();
var bidon = "%~%";
var original = ao_txtfield.value;
ao_txtfield.caretPos.text = bidon;
var i = ao_txtfield.value.search(bidon);
ao_txtfield.value = original.substr(0,i) + '[' + as_mf +'='+as_url+ '*]' + original.substr(i, ao_txtfield.value.length);
var temp = original.substr(0,i);
var nbretour =0;
for (var cpt=0;cpt<temp.length;cpt=cpt+1){
if(temp.charAt(cpt)=="\n"){
nbretour=nbretour+1;
}
}
pos = i + 2 + as_mef.length - nbretour;
var r = oField.createTextRange();
var r = ao_txtfield.createTextRange();
r.moveStart('character', pos);
r.collapse();
r.select();
var r = ao_txtfield.createTextRange();
r.moveStart('character', pos);
r.collapse();
r.select();
}
}
}
De Pyrah - le 07-05-2006
Et la derniere fonction javascript.

function resetTxtField(ao_input){
var ls_texte = ao_input.value;
var la_ar = ls_texte.split("[u]");
var tamp="";
for(var i=0;i<la_ar.length;i++){
tamp+=la_ar;
}
ls_texte = tamp;
tamp="";
la_ar = ls_texte.split("[/u]");
for(var i=0;i<la_ar.length;i++){
tamp+=la_ar[i];
}
ls_texte = tamp;
tamp="";
la_ar = ls_texte.split("[i]");
for(var i=0;i<la_ar.length;i++){
tamp+=la_ar[i];
}
ls_texte = tamp;
tamp="";
la_ar = ls_texte.split("
");
for(var i=0;i<la_ar.length;i++){
tamp+=la_ar[i];
}
ls_texte = tamp;
tamp="";
la_ar = ls_texte.split("");
for(var i=0;i<la_ar.length;i++){
tamp+=la_ar[i];
}
ls_texte = tamp;
tamp="";
la_ar = ls_texte.split("
");
for(var i=0;i<la_ar.length;i++){
tamp+=la_ar[i];
}
ls_texte = tamp;
tamp="";
la_ar = ls_texte.split("[tab]");
for(var i=0;i<la_ar.length;i++){
tamp+=la_ar[i];
}
ls_texte = tamp;
tamp="";
la_ar = ls_texte.split("[/url]");
for(var i=0;i<la_ar.length;i++){
tamp+=la_ar[i];
}
ls_texte = tamp;
var tamp="";
la_ar = ls_texte.split("[/color]");
for(var i=0;i<la_ar.length;i++){
tamp+=la_ar[i];
}
ls_texte = tamp;
var tamp="";
var bfind=false;
for(var i=0;i<ls_texte.length;i++){
if(ls_texte.charAt(i)=="["&&ls_texte.charAt(i+1)=="u"&&ls_texte.charAt(i+2)=="r"&&ls_texte.charAt(i+3)=="l"){
bfind=true;
}
if(bfind){
if(ls_texte.charAt(i)=="]"){
bfind=false;
}
}else{
tamp+=ls_texte.charAt(i);
}
}
ls_texte = tamp;
var tamp="";
var bfind=false;
for(var i=0;i<ls_texte.length;i++){
if(ls_texte.charAt(i)=="["&&ls_texte.charAt(i+1)=="i"&&ls_texte.charAt(i+2)=="m"&&ls_texte.charAt(i+3)=="g"){
bfind=true;
}
if(bfind){
if(ls_texte.charAt(i)=="]"){
bfind=false;
}
}else{
tamp+=ls_texte.charAt(i);
}
}
ls_texte = tamp;
tamp="";
var bfind=false;
for(var i=0;i<ls_texte.length;i++){
if(ls_texte.charAt(i)=="["&&ls_texte.charAt(i+1)=="c"&&ls_texte.charAt(i+2)=="o"&&ls_texte.charAt(i+3)=="l"&&ls_texte.charAt(i+4)=="o"&&ls_texte.charAt(i+5)=="r"){
bfind=true;
}
if(bfind){
if(ls_texte.charAt(i)=="]"){
bfind=false;
}
}else{
tamp+=ls_texte.charAt(i);
}
}
ls_texte = tamp;
ao_input.value=ls_texte;
}
</script>
De Pyrah - le 07-05-2006

Après le body
<form action="bbedit.php" method="POST">
<div>
<input type="button" class="formbutton" value="b" style="width:50px;font-weight:bold" onClick="storeCaret(this.form.newst,'b');" />
<input type="button" class="formbutton" value="i" style="width:50px;font-style:italic" onClick="storeCaret(this.form.newst,'i');" />
<input type="button" class="formbutton" value="u" style="width:50px;text-decoration:underline" onClick="storeCaret(this.form.newst,'u');" />
<input type="button" class="formbutton" value="url" style="width:50px;" onClick="saisie = prompt('url du site','Adresse');if(saisie!=null){storeCaretValue(this.form.newst,'url',saisie);}" />
<input type="button" class="formbutton" value="img" style="width:50px;" onClick="saisie = prompt('url de votre image','Adresse');if(saisie!=null){storeCaretIMG(this.form.newst,'img',saisie,true);}" />
<input type="button" class="colorbutton1" value=" " onClick="storeCaretValue(this.form.newst,'color','#cc0000');" />
<input type="button" class="colorbutton2" value=" " onClick="storeCaretValue(this.form.newst,'color','#00cc00');" />
<input type="button" class="colorbutton3" value=" " onClick="storeCaretValue(this.form.newst,'color','#0000cc');" />
</div>
<div>
<textarea name="newst" id="newst" rows="10" wrap="virtual" cols="45"><?php echo $newss; ?></textarea>
</div>
<div>
<input type="submit" value="Mettre en forme" /><input type="button" value="Annuler mise en forme" onClick="resetTxtField(this.form.newst);" />
</div>
</form>
De Pyrah - le 07-05-2006


en php
<?php
function replaceBBCode($as_texte){
$texte = '<p>'.$as_texte.'</p>';
$search1 = array("\n");
$texte = str_replace($search1,"</p><p>",$texte);
$search1 = array("");
$search2 = array("
");
$texte = str_replace($search1,"<span class='boldtext'>",str_replace($search2,"</span>",$texte));
$search1 = array("");
$search2 = array("
");
$texte = str_replace($search1,"<span class='italictext'>",str_replace($search2,"</span>",$texte));
$search1 = array("[u]");
$search2 = array("[/u]");
$texte = str_replace($search1,"<span class='underlinetext'>",str_replace($search2,"</span>",$texte));
$search1 = array("[img=");
$search2 = array("*]");
$texte = str_replace($search1,"<img src='",str_replace($search2,"' />",$texte));
$search1 = array("");
$search3 = array("
");
$texte = str_replace($search1,"<a href='",str_replace($search2,"' target='_blank'>",str_replace($search3,"</a>",$texte)));
$search1 = array("[color=");
$search2 = array("*color]");
$search3 = array("[/color]");
$texte = str_replace($search1,"<span style='color:",str_replace($search2,"'>",str_replace($search3,"</span>",$texte)));
return $texte;
}
if(isset($_POST["newst"])){
$newss = $_POST["newst"];
echo replaceBBCode($newss);
}
?>

reste plus que le css a gerer puis c'est fini:D
De Pyrah - le 07-05-2006
Désolé ce fut long mais voila, maintenant bbcode avec couleur et tt et tt... sorry pour le nombre de post
De linkid - le 18-06-2006
Bonjour !
Sous IE 7, il y a un problème... lorsque l'on apuie sur entrée, sa saute 2 lignes...
Et bien que je n'utilise jamais IE, les visiteurs l'utilisent...
De NoHaR - le 20-10-2006
Alors je viens de lire tout le post, MERCI ! Je suis bien content parce que c'était exactement le type de code que je cherchais...
Par contre, ton code PHP pour la gestion du BB-code est assez moche :D , alors je me permets de proposer celui que j'ai tendance à utiliser à titre d'exemple, histoire de perfectionner :

<?php
function get_bbcode($text)
{
$text=nl2br($text);
$text = preg_replace('!\[g\](.+)\[/g\]!isU', '<strong>$1</strong>', $text);
$text = preg_replace('!\[i\](.+)\[/i\]!isU', '<em>$1</em>', $text);
$text = preg_replace('!\[s\](.+)\[/s\]!isU', '<span style="text-decoration:underline;">$1</span>', $text);
$text = preg_replace('!\[centre\](.+)\[/centre\]!isU', '<p tyle="text-align:center;margin:0px;padding:0px;">$1</p>', $text);
$text = preg_replace('!\[droite\](.+)\[/droite\]!isU', '<p style="text-align:right;margin:0px;padding:0px;">$1</p>', $text);
$text = preg_replace('!\[gauche\](.+)\[/gauche\]!isU', '<p style="text-align:left;margin:0px;padding:0px;">$1</p>', $text);
$text = preg_replace('!\[justifie\](.+)\[/justifie\]!isU', '<p style="text-align:justify;margin:0px;padding:0px;">$1</p>', $text);
$text = preg_replace('!\[titre\](.+)\[/titre\]!isU', '<h3>$1</h3>',$text);
} //etc...
?>


bon évidemment mes balises BB-code n'ont rien à voir avec ton exemple, mais c'est juste pour montrer l'utilité des Regex en PHP : tu appelles cette fonction à l'affichage du texte, juste après l'avoir loadé de ta BDD, comme ça le texte est enregistré dans la BDD en BB-code, ce qui permet que l'affichage des textes BB-codés évolue en meme temps que le design, sans rien avoir à changer... ce qui permet aussi d'éviter de mettre du html partout dans la bdd, ce qui lui donne de la portabilité, de site en site...

Bon, 'fin là je chipote, mais merci en tout cas pour ton script :D
De parsifal - le 24-06-2007
salut, je suis débutant en bbcode et php. Je voudrais utiliser ce script pour changer du contenu texte en ligne et le sauvegarder. Le nouveau texte ou le texte corrigé devrait ensuite s'afficher dans ma page. Est-ce possible avec ce script ou est-ce seulement un script de mise en forme? Merci
De eric0279 - le 18-03-2008
Bonsoir,

j'ai essayé d'insérer ce script dans un forum basé sur phpbb mais cela ne fonctionne pas...

Un peu d'aide svp :)

Merci

>> Poster une annotation sur ce script






7 visiteurs
actuellement en ligne

    PUBLICITE



     ANNUAIRE WEBMAST.
PriceMinister
Achat vente de produits informatiques d'occasion.
http://www.priceminister.com
Cat : Hardware
Voir l'annuaire webmaster


     LES SCRIPTS :
78 à éditer
68 à copier/coller
247 des membres
2580 sur le web
>> Tous les scripts

     LES MEMBRES :
54416 membres
9050 comptes CountUs
1420 comptes myCircle

     LES FORUMS :
14 forums
39081 topics
188346 messages
>> Les forums

    SONDAGE

Vous avez un blog ou site classique ?
Un blog
Un site classique
Les deux !
La mini-astuce "Referencement" du jour par cybermax
Référencement Flash : comment référencer un site web réalisé en Flash ?
Tapez l'adresse de votre animation Flash ci-dessous :
http://www.flash-moteurs.com
Proposer votre mini-astuce | Archives des mini-astuces
© 1999-2008 K-NETWORK - Tous droits réservés | CNIL N° 844440 | 20/07/2008 06:28:00 | Design by Studcrea | Gen. en 0.452 sec.