Aller au menu - Aller au contenu

[Plan du site] Vous êtes ici --- > Le Site du Zéro > Les forums > Site Web > XHTML / CSS > Prévisualisation en "live" > Lecture du sujet

Prévisualisation en "live"

Les différents moyens de procédé ?

Vous devez être inscrit pour pouvoir poster des messages

Page : 1 
Auteur Message
1 visiteur sur ce sujet (1 anonyme)
Page : 1 
Hors ligne jeremdu06 # Posté le 26/11/2005 à 22:46:32
Vivement la retraite !
Avatar
Groupe : Membres
Bonsoir ! :)

j'ai presque fini mon BBcode et ça serait simpa que j'ajoute une prévisualisation du message en direct.
Je voudrais savoir quels sont les différents moyens de procéder ?
Merci

EDIT : Désolé je voulais le mettre dans le forum PHP... Si un modo peut déplacé le topic. Merci (encore désolé)

Édité le 26/11/2005 à 22:48:46 par jeremdu06

Prévisualisation direct Besoin de quelqu'un qui s'y connais ! Merci
 
Hors ligne alex.hitman # Posté le 26/11/2005 à 23:02:12
Groupe : Membres
Je pense que ce message est dans le bon forum car c'est avec du javascript que la prévisualisation en direct se fera.

Regarde du coté de la propriété innerHTML.
 
Hors ligne Didjor # Posté le 27/11/2005 à 10:28:56
Avatar
Groupe : Membres
Un sujet similaire existe : La prévisualisation du zform
(J'ai pas regardé lequel des deux sujets a été créé en premier, je dis juste qu'il y a un doublon. ^^)

--Didjor--
 
Hors ligne jeremdu06 # Posté le 27/11/2005 à 12:28:31
Vivement la retraite !
Avatar
Groupe : Membres
Apararemment pas besoin d'ajax.
J'ai trouver un script mais je ne sais pas comment le modifié.
En fait ce qui m'intérresse c'est seulement la partie du haut, à savoir jusqu'a function automatique() parce que le reste (le remplacement des balises) ce fait par du php avec des preg_replace.
Comment faire pour l'adapter ? ou doit-je mettre mes preg_replace?

Code : PHP
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Administration</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" media="screen" type="text/css" title="design" href="/INFOWEB/admin/include/css_admin.css" />

<script>
// JavaScript Auteur: http://tofem.net/ressources
var timer=0;
var ptag=String.fromCharCode(5,6,7);
function  visualisation() {
        t=document.formu.texte.value 
        t=code_to_html(t)
        if (document.getElementById) document.getElementById("previsualisation").innerHTML=t
        if (document.formu.auto.checked) timer=setTimeout(visualisation,1000)
}
function automatique() {
        if (document.formu.auto.checked) visualisation()
}
function code_to_html(t) {
        t=nl2khol(t)
// balise Gras
        t=deblaie(/(\[\/b\])/g,t)
        t=remplace_tag(/\[b\](.+)\[\/b\]/g,'<b>$1</b>',t) 
        t=remblaie(t)
// balise Italique
        t=deblaie(/(\[\/i\])/g,t)
        t=remplace_tag(/\[i\](.+)\[\/i\]/g,'<i>$1</i>',t) 
        t=remblaie(t)
// balise Underline
        t=deblaie(/(\[\/u\])/g,t)
        t=remplace_tag(/\[u\](.+)\[\/u\]/g,'<u>$1</u>',t) 
        t=remblaie(t)
// balise quote
        t=deblaie(/(\[\/quote\])/g,t)
        t=remplace_tag(/\[quote\](.+)\[\/quote\]/g,'<p class="quote">$1</p>',t) 
        t=remblaie(t)
// balise code 
        t=remplace_tag(/\[code\](.+)\[\/code\]/g,'<code>$1</ code>',t) 
// balise Img
        t=deblaie(/(\[\/img\])/g,t)
        t=remplace_tag(/\[img\](.+)\[\/img\]/g,'<img src="$1"/>',t)
        t=remblaie(t)
// balise URL   
        t=remplace_tag(/\[url=([^\s<>]+)\](.+)\[\/url\]/g,'<a href="$1" target="_blank">$2</a>',t)
// balise Color 
        t=deblaie(/(\[\/color\])/g,t)
        t=remplace_tag(/\[color=(#[a-fA-F0-9]{6})\](.+)\[\/color\]/g,'<font color="$1">$2</font>',t)
        t=remblaie(t)
// balise size 
        t=deblaie(/(\[\/size\])/g,t)
        t=remplace_tag(/\[size=([+-]?[0-9])\](.+)\[\/size\]/g,'<font size="$1">$2</font>',t)
        t=remblaie(t)
        t=unkhol(t)
        t=nl2br(t)
        return t
}
function deblaie(reg,t) {
        texte=new String(t);
        return texte.replace(reg,'$1\n');
}
function remblaie(t) {
        texte=new String(t);
        return texte.replace(/\n/g,'');
}
function remplace_tag(reg,rep,t) {
        texte=new String(t);
        return texte.replace(reg,rep);
}
function nl2br(t) {
        texte=new String(t);
        return texte.replace(/\n/g,'<br/>');
}
function nl2khol(t) {
        texte=new String(t);
        return texte.replace(/\n/g,ptag);
}
function unkhol(t) {
        texte=new String(t);
        return texte.replace(new RegExp(ptag,'g'),'\n');
}
</script>

</head>
<body>

<form name="formu">
Entrez un texte  :<br />
<textarea name="texte" id="texte"></textarea><br />
<input type="button" value="Prévisualiser" onClick="visualisation()">
<input name="auto" type="checkbox" onClick="automatique()"> Auto
</form>
<span id="previsualisation">&nbsp;</span>

</body>
</html>


Voilà ! Merci ! ^^

Prévisualisation direct Besoin de quelqu'un qui s'y connais ! Merci
 

Retour au forum "XHTML / CSS" ou à la liste des forums

Vous devez être inscrit pour pouvoir poster des messages

Changer de design | En savoir plus | Plan du site | Politique d'accessibilité | Règles | RSS tutoriels | RSS news
Édité par Simple IT SARL : Nous contacter | Notre blog | Revue de presse | Publicité

Y'a plus rien à lire, faut remonter maintenant !

Hébergement web - Correction de tutoriels - Créer un site
Vous souhaitez apparaître ici ? Contactez-nous.

Nombre de connectés 206 Zéros connectés | Requêtes SQL 7 requêtes | Temps de génération de la page : Total (SQL) 0.0267s (0.0107s)