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 :

Insérer des smileys


Sujet :

JavaScript

Vue hybride

Message précédent Message précédent   Message suivant Message suivant
  1. #1
    actualite
    Invité(e)
    Par défaut Insérer des smileys
    bonjour voilà j'éxpose mon petit probléme

    j'ai fais mon livre d'or et j'ai voulu mettre des smileys et des champs 1 er éffacable et pas au 2 éme clique

    donc voilà la page

    http://le.coffre.free.fr/livre_d_or.php

    et ma page :

    <h5>livre d'or</h5>

    <form method="post" action="livre_d_or.php" name="formulaire">

    Mon site vous plaît ? Laissez-moi un message !
    <br />
    <br />
    <input type="text" name="pseudo" value="votre pseudo" onfocus="javascript: EffacerContenuParDefaut()" />
    <br />
    <br/>
    <input type="text" name="siteweb" id="siteweb" size="35" maxlength="30" onfocus="javascript: EffacerContenuParDefaut()" value="http://Votre_site">
    <br />


    <img src="images/livre_d_or/hello.gif" title="hello" alt="hello" onClick="javascript:smilies('hello');return(false)" />
    <img src="images/livre_d_or/bye.gif" title="bye" alt="bye" onClick="javascript:smilies('bye');return(false)" />
    <img src="images/livre_d_or/clin_d_oeil.gif" title="clin d'oeil" alt="clin d'oeil" onClick="javascript:smilies('clin d'oeil');return(false)" />
    <img src="images/livre_d_or/cool.gif" title="cool" alt="cool" onClick="javascript:smilies('cool');return(false)" />
    <img src="images/livre_d_or/mort_de_rire.gif" title="mdr" alt="mdr" onClick="javascript:smilies('mdr');return(false)" />
    <img src="images/livre_d_or/pas_bien.gif" title="pas bien" alt="pas bien" onClick="javascript:smilies('pas bien');return(false)" />
    <img src="images/livre_d_or/tres_bien.gif" title="trés bien" alt="trés bien" onClick="javascript:smilies('trés bien');return(false)" />
    <br />
    <br />
    <input type="button" id="gras" name="gras" value="Gras" onClick="javascript:bbcode('[g]', '[/g]');return(false)" />
    <input type="button" id="italic" name="italic" value="Italic" onClick="javascript:bbcode('', '');return(false)" />
    <input type="button" id="souligné" name="souligné" value="Souligné" onClick="javascript:bbcode('', '');return(false)" />
    <br />
    <br />
    <textarea type="text" name="message" value="votre message" cols="50" rows="8" onfocus="javascript: EffacerContenuParDefaut()"></textarea>
    <br />
    <br />
    <input type="submit" value="Envoyer" />
    <br />
    <br />
    et j'ai fait aussi une page javascript :


    var timer=0;
    var ptag=String.fromCharCode(5,6,7);
    function previsualisation() {
    t=document.formulaire.textarea.value
    t=code_to_html(t)
    if (document.getElementById) document.getElementById("prev").innerHTML=t
    function bbcode(bbdebut, bbfin)
    {
    var input = window.document.formulaire.message;
    input.focus();
    /* pour IE (toujous un cas appar lui )*/
    if(typeof document.selection != 'undefined')
    {
    var range = document.selection.createRange();
    var insText = range.text;
    range.text = bbdebut + insText + bbfin;
    range = document.selection.createRange();
    if (insText.length == 0)
    {
    range.move('character', -bbfin.length);
    }
    else
    {
    range.moveStart('character', bbdebut.length + insText.length + bbfin.length);
    }
    range.select();
    }
    /* pour les navigateurs plus récents que IE comme Firefox... */
    else if(typeof input.selectionStart != 'undefined')
    {
    var start = input.selectionStart;
    var end = input.selectionEnd;
    var insText = input.value.substring(start, end);
    input.value = input.value.substr(0, start) + bbdebut + insText + bbfin + input.value.substr(end);
    var pos;
    if (insText.length == 0)
    {
    pos = start + bbdebut.length;
    }
    else
    {
    pos = start + bbdebut.length + insText.length + bbfin.length;
    }
    input.selectionStart = pos;
    input.selectionEnd = pos;
    }
    /* 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 smilies(img)
    {
    window.document.formulaire.message.value += '' + img + '';
    }


    function vide_input()
    {
    if(document.getElementById('input').value == 'Votre pseudo')
    {
    document.getElementById('input').value = '';
    }
    if(document.getElementById('message').innerHtml == 'Votre message')
    {
    document.getElementById('message').innerHtml = '';
    }

    function EffacerContenuParDefaut(var effacerContenuDuChamp)
    {
    effacerContenuDuChamp.value='';
    effacerContenuDuChamp.setAttribute('onfocus', '');
    }
    et bien entendu j'ai mi un lien en haut

    <!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>Bienvenue sur mon site</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-15" />
    <link href="design/par_default/par_default.css" rel="stylesheet" type="text/css" />
    <link href="javascript.js" type="text/javascript" />
    </head>
    <body>
    es ce que vous m'aidé a faire fonctionné ces smileys et les champs dans les texteréa et les imputs

    merci de votre aide

  2. #2
    Membre Expert
    Avatar de Jim_Nastiq
    Homme Profil pro
    Architecte, Expert Flex
    Inscrit en
    Avril 2006
    Messages
    2 335
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Haute Garonne (Midi Pyrénées)

    Informations professionnelles :
    Activité : Architecte, Expert Flex
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : Avril 2006
    Messages : 2 335
    Par défaut
    je ne suis pas sur d'avoir compris, en fait tu veux un fonctionnement similaire a ce forum, tu souhaites lors d'un clic sur un smiley ajouter le code correspondant dans le textarea, c'est bien ca?

    par contre j'ai pas compris ton histoire de clic

    Pensez vraiment à effectuer une recherche avant de poster, ici et sur un moteur de recherche! c'est la moindre des choses
    Pensez au tag

    Mon Blog sur la techno Flex
    Ma page sur Developpez.com

    Jim_Nastiq

  3. #3
    actualite
    Invité(e)
    Par défaut
    re

    on faite t'a tout à fait compris quand on clique sur un smiley il ne met pas dans le texterea donc il seras pas dans le message que la personne à écrit

    et pour les champs j'aimerais bien quand on clique ça s'éfface donc j'ai bien mis le code valu
    et j'aimerais désactivé le 2 eme clique car quand tu clique ça séfface mais quand tu tape et il s'apperçoit il y as un mot oublié donc il reclique sur le cadre mais il éfface a nouveau

    donc il faut activé le 1 er clique et désactivé le 2 éme clique

    merci d'avance

  4. #4
    Membre Expert
    Avatar de Jim_Nastiq
    Homme Profil pro
    Architecte, Expert Flex
    Inscrit en
    Avril 2006
    Messages
    2 335
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Haute Garonne (Midi Pyrénées)

    Informations professionnelles :
    Activité : Architecte, Expert Flex
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : Avril 2006
    Messages : 2 335
    Par défaut
    bon je te prévient c'est un peu de la bidouille mais je peux pas tester plus en profondeur d'ou je t'écris mais cela fonctionne...

    en utilisant onclick au lieu de onfocus sur ton textarea et une fonction de ce genre ca devrait aller

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    function EffacerContenuParDefaut(){
    	var tmp = document.getElementById('message').value;
    	if(tmp == 'votre message')
    	 	tmp = '';
     
    }

    pour ce qui est de l'ajout de smiley il te faut ajouter dynamiquement ton image avec javascript, si tu met seulement le lien de l'image ca ne fonctionnera pas il faut que le contenu de ton textarea contienne une indication pour que ta page qui lit les notations dans ton livre d'or puisse traduire ce smiley en image! par exemple le BBcode... a toi de creuser

    Pensez vraiment à effectuer une recherche avant de poster, ici et sur un moteur de recherche! c'est la moindre des choses
    Pensez au tag

    Mon Blog sur la techno Flex
    Ma page sur Developpez.com

    Jim_Nastiq

  5. #5
    actualite
    Invité(e)
    Par défaut
    merci quan même pour ton aide mais ça n'a pas marché
    mais je vais y réféchir

  6. #6
    Membre Expert
    Avatar de Jim_Nastiq
    Homme Profil pro
    Architecte, Expert Flex
    Inscrit en
    Avril 2006
    Messages
    2 335
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Haute Garonne (Midi Pyrénées)

    Informations professionnelles :
    Activité : Architecte, Expert Flex
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : Avril 2006
    Messages : 2 335
    Par défaut
    oui ca ne fonctionne pas sur les input mais sur les textarea!
    pour les input voici une solution (trouvée sur le net)

    ton HTML:

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    <input type="text" id="recherche" value="" onfocus="textepardefaut('prisedefocus')" onblur="textepardefaut('pertedefocus')"/>							
    <script type="text/javascript">textepardefaut('chargement')</script>
    ton javascript:
    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
    function textepardefaut(evenement){
     
    	if(evenement=="chargement")
     
    	{
     
    		if(document.getElementById('recherche').value == "")
     
    		{
     
    			document.getElementById('recherche').value = 'Tapez ici votre recherche';
     
    		}
     
    	}
     
    	if(evenement=="prisedefocus")
     
    	{
     
    		if(document.getElementById('recherche').value == "Tapez ici votre recherche")
     
    		{
     
    			document.getElementById('recherche').value = '';
     
    		}
     
    	}
     
    	if(evenement=="pertedefocus")
     
    	{
     
    	if(document.getElementById('recherche').value == "")
     
    		{
     
    			document.getElementById('recherche').value = 'Tapez ici votre recherche';
     
    		}
     
    	}
     
    }

    Pensez vraiment à effectuer une recherche avant de poster, ici et sur un moteur de recherche! c'est la moindre des choses
    Pensez au tag

    Mon Blog sur la techno Flex
    Ma page sur Developpez.com

    Jim_Nastiq

Discussions similaires

  1. FCKeditor insérer des smiley de l'extérieur
    Par Death83 dans le forum Général JavaScript
    Réponses: 1
    Dernier message: 19/07/2006, 17h35
  2. insérer des images dans une bd postgresql
    Par ephet dans le forum PostgreSQL
    Réponses: 3
    Dernier message: 20/01/2004, 09h18
  3. insérer des caractères accentués INFORMIX/JDBC
    Par donde dans le forum Informix
    Réponses: 2
    Dernier message: 19/11/2002, 20h02

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