Afficher un message au clic de la souris

MartinLabrosse Messages postés 236 Date d'inscription   Statut Membre Dernière intervention   -  
Dalida Messages postés 7114 Date d'inscription   Statut Contributeur Dernière intervention   -
Bonjour,
J'ai un problème, j'aimerai que lorsque je clique sur un mot, un autre apparait..
Exemple, je clique sur Cliquez sur moi et puis en dessous ou à coté ca affiche Bravo !!!!
Est-ce possible en html ou autre ?
Merci d'avance !
Configuration: Windows XP
Firefox 3.0.6

38 réponses

  • 1
  • 2
Résumé de la discussion

Question initiale : il est demandé d’afficher dynamiquement un mot différent au clic, par exemple remplacer « Clique sur moi » par « Bravo !!!! », en HTML ou JavaScript. Plusieurs réponses proposent une fonction JavaScript type toggleText qui remplace le texte d’un élément et le rétablit au clic suivant. Des conseils pratiques évoquent aussi l’enregistrement en .html et l’ouverture locale pour tester le comportement, ainsi que des ajustements comme innerHTML, InnerHTML et l’ajout éventuel d’un paramètre CSS. En complément, certains échanges abordent des corrections liées à la duplication de fonctions et proposent des démonstrations pratiques pour clarifier la mise en œuvre sans conclure sur l’état du fil.

Bobot (l'IA à votre service)
  1. Dalida Messages postés 7114 Date d'inscription   Statut Contributeur Dernière intervention   923
     
    salut,

    essaie avec ça :
    <span onclick="this.InnerHTML='nouveau mot'">le mot à changer</span>
    0
  2. MartinLabrosse Messages postés 236 Date d'inscription   Statut Membre Dernière intervention   29
     
    Dsl mais ça marche pas !
    Ca ne me mets que le premier mot et quand je clique dessus, ca ne fait rien du tout...
    Tu comprend ?
    0
  3. Dalida Messages postés 7114 Date d'inscription   Statut Contributeur Dernière intervention   923
     
    oups, la majuscule…
    <span onclick="this.innerHTML='nouveau mot'">le mot à changer</span>
    0
  4. MartinLabrosse Messages postés 236 Date d'inscription   Statut Membre Dernière intervention   29
     
    Ne t'inquiète pas, ça arrive à tout le monde de se tromper.
    Merci de ton aide ! Je teste et je te dis si ça marche...

    A plus !
    0
  5. Vous n’avez pas trouvé la réponse que vous recherchez ?

    Posez votre question
  6. MartinLabrosse Messages postés 236 Date d'inscription   Statut Membre Dernière intervention   29
     
    Ca marche mais j'aimerai bien que quand je reclique sur le NOUVEAU mot, ça me remet à l'ancien...
    Est-ce possible ?
    0
  7. Dalida Messages postés 7114 Date d'inscription   Statut Contributeur Dernière intervention   923
     
    oui bien sûr mais il faut créer une fonction, ce sera plus pratique.
    de tête :
    <script type="text/javascript">
    function toggleText(lmt, text)
    {
    	if(!lmt)
    		return false;
    	var prevText = lmt.innerHTML;
    	lmt.innerHTML = text;
    	lmt.onclick = function{ toggleText(lmt, prevText); };
    }
    </script>

    et dans le texte :
    <span onclick="toggleText(this,'nouveau text')">blabla</span>
    0
  8. MartinLabrosse Messages postés 236 Date d'inscription   Statut Membre Dernière intervention   29
     
    Ou doi-je coller la fonction que tu m'as donné sur mon forum ?
    0
  9. MartinLabrosse Messages postés 236 Date d'inscription   Statut Membre Dernière intervention   29
     
    Ca marche pas !!! Dsl mais c'est comme au tout début, ca m'affiche que le premier mot et je ne peut même pas cliquer dessus...
    Pourquoi ?
    0
  10. Dalida Messages postés 7114 Date d'inscription   Statut Contributeur Dernière intervention   923
     
    j'avais oublié une paire de parenthèse…

    démonstration
    0
  11. MartinLabrosse Messages postés 236 Date d'inscription   Statut Membre Dernière intervention   29
     
    Je dois faire quoi avec la page que tu me donnes ?
    0
  12. Dalida Messages postés 7114 Date d'inscription   Statut Contributeur Dernière intervention   923
     
    ben en générale avec une démonstration, on regarde, on teste…

    sinon tu peux toujours l'apprendre par cœur…
    0
  13. MartinLabrosse Messages postés 236 Date d'inscription   Statut Membre Dernière intervention   29
     
    Et est-ce que tu peux me redonner le code complet avec les parenthèses que tu as oubliés ?
    Merci...
    0
  14. Dalida Messages postés 7114 Date d'inscription   Statut Contributeur Dernière intervention   923
     
    avec la démo il suffit de faire menu Affichage/Afficher le code source.

    d'où la démo…
    -;o)
    0
  15. MartinLabrosse Messages postés 236 Date d'inscription   Statut Membre Dernière intervention   29
     
    Je ne comprend pas, j'arrive sur une page et il n'y a pas de codes...
    Mais j'aimerai que tu me donnes le code ou quand tu cliques sur teste, ca te mets bravo et quand tu cliques sur bravo, ce te REMET teste.
    0
  16. MartinLabrosse Messages postés 236 Date d'inscription   Statut Membre Dernière intervention   29
     
    Ca marche sur la démo mais je sais pas comment on fait en fait, je ne connais pas le code. Pourrais tu me le donner ???
    0
  17. Dalida Messages postés 7114 Date d'inscription   Statut Contributeur Dernière intervention   923
     
    entre <head> et </head> tu mets :
    		<script type="text/javascript">
    function toggleText(lmt, text)
    {
    	if(!lmt)
    		return false;
    	var prevText = lmt.innerHTML;
    	lmt.innerHTML = text;
    	lmt.onclick = function(){ toggleText(lmt, prevText); };
    }
    		</script>
    

    et dans ton texte tu glisses :
    <span onclick="toggleText(this,'bravo')">teste</span>
    0
  18. MartinLabrosse Messages postés 236 Date d'inscription   Statut Membre Dernière intervention   29
     
    Je vais essayer.
    0
  19. MartinLabrosse Messages postés 236 Date d'inscription   Statut Membre Dernière intervention   29
     
    Il y a un truc que je ne comprend pas (désolé) c'est, OU je mets dans le texte le truc la !

    <head>
    <script type="text/javascript">
    function toggleText(lmt, text)
    {
    	if(!lmt)
    		return false;
    	var prevText = lmt.innerHTML;
    	lmt.innerHTML = text;
    	lmt.onclick = function(){ toggleText(lmt, prevText); };
    0
  20. Dalida Messages postés 7114 Date d'inscription   Statut Contributeur Dernière intervention   923
     
    salut,

    entre <head> et </head>, à priori c'est bien parti !
    0
  21. MartinLabrosse Messages postés 236 Date d'inscription   Statut Membre Dernière intervention   29
     
    Comme ça ? :

    <head>		
    
    <script type="text/javascript">
    function toggleText(lmt, text)
    {
    	if(!lmt)
    		return false;
    	var prevText = lmt.innerHTML;
    	lmt.innerHTML = text;
    	lmt.onclick = function(){ toggleText(lmt, prevText); };
    }
    		</script>
    </head>
    
    <span onclick="toggleText(this,'Nouveau mot')">Premier mot</span>
    
    
    0
  • 1
  • 2