IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

JavaScript Discussion :

Insertion de balises html dans zone de texte


Sujet :

JavaScript

  1. #1
    Membre à l'essai
    Inscrit en
    Avril 2007
    Messages
    21
    Détails du profil
    Informations forums :
    Inscription : Avril 2007
    Messages : 21
    Points : 20
    Points
    20
    Par défaut Insertion de balises html dans zone de texte
    Bonjour all,
    j'aimerais creer une zone de texte(ex textarea) ou l'utilisateur pourrait bien entendu ecrire dedans mais surtout pouvoir ecrire en gras, changer la couleur du texte,etc.
    En fait, le top serait la meme fenetre qu'on a ici lol quand on poste un message.
    vous pouvez m'aider ?
    ca marche pas si je copie colle le code source

  2. #2
    Modérateur
    Avatar de Bisûnûrs
    Profil pro
    Développeur Web
    Inscrit en
    Janvier 2004
    Messages
    9 868
    Détails du profil
    Informations personnelles :
    Âge : 40
    Localisation : France, Rhône (Rhône Alpes)

    Informations professionnelles :
    Activité : Développeur Web

    Informations forums :
    Inscription : Janvier 2004
    Messages : 9 868
    Points : 16 258
    Points
    16 258

  3. #3
    Membre à l'essai
    Inscrit en
    Avril 2007
    Messages
    21
    Détails du profil
    Informations forums :
    Inscription : Avril 2007
    Messages : 21
    Points : 20
    Points
    20
    Par défaut
    ok merci bisounours,
    par contre ca....marche pas...
    désolé d'etre un boulet inside, mais ca m'affiche que les 2 select et rien d'autre, que ce soit sous IE ou Firefox

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    <!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>Page sans titre</title>
    </head>
    <body>
    <script language="jscript" type="text/javascript">
    function bbcode(bbdebut, bbfin){
            var input = window.document.redaction_administration.textarea;
            input.focus();
            /* pour IE (toujous un cas appart lui )*/
            if(typeof document.selection != 'undefined'){
              var str = document.selection.createRange().text;
                input.focus();
                var sel = document.selection.createRange();
                if(str == ""){
                   sel.text = sel.text + bbdebut + bbfin;
                    sel.moveStart("character", -bbfin.length);
                    sel.moveEnd("character", -bbfin.length);
                    sel.select();
                               }
                    else
                    sel.text = bbdebut + sel.text + bbfin;
     
            }
            /* pour les autres navigateurs comme Netscape... */
            else{
                    var pos;
                    var re = new RegExp('^[0-9]{0,3}$');
                    while(!re.test(pos)) pos = prompt("insertion (0.." + input.value.length + ";):", "0");
                    if(pos > input.value.length) pos = input.value.length;
                    var insText = prompt("Veuillez taper le texte");
                    input.value = input.value.substr(0, pos) + bbdebut + insText + bbfin + input.value.substr(pos);
            }
    }
    function smileys(img)
    {
    window.document.redaction_administration.textarea.value += '' + img + '';
    }
     
    </script>
    <div>
            <div onclick="javascript:bbcode('[gras]', '[/gras]');return(false)"></div>
            <div onclick="javascript:bbcode('[italic]', '[/italic]');return(false)"></div>
            <div onclick="javascript:bbcode('[underline]', '[/underline]');return(false)"></div>
    </div>
     
     <div>
            <div  onclick="javascript:bbcode('[gauche]', '[/gauche]');return(false)"></div>
            <div onclick="javascript:bbcode('[centre]', '[/centre]');return(false)"></div>
            <div onclick="javascript:bbcode('[droite]', '[/droite]');return(false)"></div>
                    <div onclick="javascript:bbcode('[justifie]', '[/justifie]');return(false)"></div>
    </div>
     
    <div>      
              <div onclick="javascript:code();return(false)"></div>
            <div onclick="javascript:code2();return(false)"></div>
    </div>
     
    <select name="couleur">
    <option selected="selected">Couleur</option>
            <option value="rouge" onclick="javascript:bbcode('[rouge]', '[/rouge]');return(false)">rouge</option>
            <option value="bleu" onclick="javascript:bbcode('[bleu]', '[/bleu]');return(false)">bleu</option>
    </select>
     
     
    <select name="taille_texte" class="taille_texte">
    <option selected="selected">Taille du texte</option>
            <option value="petit" onclick="javascript:bbcode('[taille=petit]', '[/taille]');return(false)">Petit</option>
            <option value="grand" onclick="javascript:bbcode('[taille=grand]', '[/taille]');return(false)">Grand</option>
    </select>
    </body>
    </html>

  4. #4
    Modérateur
    Avatar de Bisûnûrs
    Profil pro
    Développeur Web
    Inscrit en
    Janvier 2004
    Messages
    9 868
    Détails du profil
    Informations personnelles :
    Âge : 40
    Localisation : France, Rhône (Rhône Alpes)

    Informations professionnelles :
    Activité : Développeur Web

    Informations forums :
    Inscription : Janvier 2004
    Messages : 9 868
    Points : 16 258
    Points
    16 258
    Par défaut
    T'as pas le code HTML du textarea ... Rien d'étonnant en somme.

  5. #5
    Membre à l'essai
    Inscrit en
    Avril 2007
    Messages
    21
    Détails du profil
    Informations forums :
    Inscription : Avril 2007
    Messages : 21
    Points : 20
    Points
    20
    Par défaut
    ok thx.
    Question Subsidiaire: ca fait 3h que je cherche sans trouver
    Comment recuere t on le CR quand l'utilisateur click sur entrée dans un textarea ?
    j'ai essayé &#13, &#24, \n, \r\n, rien n'y fait...

  6. #6
    Modérateur
    Avatar de Bisûnûrs
    Profil pro
    Développeur Web
    Inscrit en
    Janvier 2004
    Messages
    9 868
    Détails du profil
    Informations personnelles :
    Âge : 40
    Localisation : France, Rhône (Rhône Alpes)

    Informations professionnelles :
    Activité : Développeur Web

    Informations forums :
    Inscription : Janvier 2004
    Messages : 9 868
    Points : 16 258
    Points
    16 258
    Par défaut
    \n devrait suffire, seulement quand tu affiches \n en HTML ça ne fait rien, il faut faire un
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    str.replace(/\n/g,"<br />")
    où str est ta chaîne de sortie de ton textarea.

  7. #7
    Membre à l'essai
    Inscrit en
    Avril 2007
    Messages
    21
    Détails du profil
    Informations forums :
    Inscription : Avril 2007
    Messages : 21
    Points : 20
    Points
    20
    Par défaut
    ca marche pas
    ca change rien

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    window.document.form1.textarea.value.replace(/\n/g,"<br />")

  8. #8
    Modérateur
    Avatar de Bisûnûrs
    Profil pro
    Développeur Web
    Inscrit en
    Janvier 2004
    Messages
    9 868
    Détails du profil
    Informations personnelles :
    Âge : 40
    Localisation : France, Rhône (Rhône Alpes)

    Informations professionnelles :
    Activité : Développeur Web

    Informations forums :
    Inscription : Janvier 2004
    Messages : 9 868
    Points : 16 258
    Points
    16 258
    Par défaut
    Pourtant je viens d'essayer ça et ça fonctionne très bien :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    function test() {
       document.getElementById("menu").value = document.getElementById("menu").value.replace(/\n/g,"<br />");
    }
    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    <textarea id="menu"></textarea>
    <input type="button" onclick="test()" value="Replace" />

  9. #9
    Membre à l'essai
    Inscrit en
    Avril 2007
    Messages
    21
    Détails du profil
    Informations forums :
    Inscription : Avril 2007
    Messages : 21
    Points : 20
    Points
    20
    Par défaut
    wow ca marche avec ton code oO
    you're a rock star, thx

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. Insérer des balises HTML dans une zone de texte
    Par selinav dans le forum EDI, CMS, Outils, Scripts et API
    Réponses: 1
    Dernier message: 16/12/2008, 21h52
  2. interpréter les balises html dans un texte
    Par aymenroma dans le forum JSF
    Réponses: 2
    Dernier message: 04/09/2008, 18h18
  3. Inserer des balise html dans une zone de text du rapport
    Par jacky2677 dans le forum iReport
    Réponses: 1
    Dernier message: 12/08/2008, 13h08
  4. Insertion balise html dans Textarea
    Par flow-bolox dans le forum Général JavaScript
    Réponses: 17
    Dernier message: 13/07/2007, 17h43
  5. Problème d'insertion dans zone de texte
    Par roots_man dans le forum Général JavaScript
    Réponses: 3
    Dernier message: 06/06/2005, 12h21

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo