Actualiser une fonction en cliquant sur un bouton

Résolu

Caetera Messages postés 234 Date d'inscription Statut Membre Dernière intervention -
Caetera Messages postés 234 Date d'inscription Statut Membre Dernière intervention - 4 juil. 2020 à 04:33

Bonjour à toutes et à tous,
J'apprends javascript, ce que je veux faire c'est créer un bouton qui permette d'afficher du texte, ici il s'agit d'une fonction qui génère un mot au hasard issu d'une liste. Jusque là c'est ok, ça fonctionne comme je veux. J'aimerais que la fonction s'actualise à chaque fois que l'on clique sur le bouton qui affiche le texte, c'est ici que je bloque.
Je sais qu'il existe location.reload() mais cette méthode actualise la page quand moi je voudrais simplement actualiser la fonction

Voici mon code (HTML puis JS):

<html>
<head>
    <script src="script.js"></script>
</head>
<body>
    <div id="div1" style="visibility: hidden">
        <script>document.write(result)</script>    
    </div>
    <div id="div2">
        <center>
            <button class="bouton" id="clique" onclick="javascript:afficher('div1')">clique</button>
        </center>
    </div>
</body> 
</html>

(JS)

function champLexHab(){
    var hasard = Math.floor(Math.random()*11);
    var listeDeMots = ['maison', 'appartement', 'porte', 'fenêtre', 'chaise', 'cheminée', 'escalier', 'cuisine', 'salle de bain', 'chambre', 'couloir'];
    return(listeDeMots[hasard])
}

var result = champLexHab();
// console.log(result);

function afficher(id){
    if(document.getElementById(id).style.visibility="hidden")
    {
        document.getElementById(id).style.visibility="visible";
    }
    else{
        document.getElementById(id).style.visibility="hidden";
    }
    return true;
}

EDIT : Ajout des balises de code

(je n'arrive pas à afficher les balises de code "access denied : you don't have permission to access" - je poste depuis mon téléphone)

A voir également:

Bouton d'actualisation
Bouton reinitialisation pc - Guide
Réinitialiser chromecast sans bouton - Guide
Diagnostic bouton photo - Accueil - Outils
Bouton on/off comment savoir - Forum Word
Bouton on off ✓ - Forum Loisirs / Divertissements

3 réponses

Réponse 1 / 3

jordane45 Messages postés 38480 Date d'inscription Statut Modérateur Dernière intervention 4 746

Bonjour,

Pas très clair tes explications...

Mais si j'ai compris, tu voudrais que ta fonction champLaxHab se relance à chaque clique sur ton bouton ?

Dans ce cas, il te suffit de mettre ta ligne de code

var result = champLexHab();

Dans ta fonction afficher

Et au lieu d'utiliser le document.write (qu'il faut désormais éviter d'utiliser..) dans ton html ... placer dans ta fonction afficher un

document.getElementById('div1').innerHTML = result;

Réponse 2 / 3

Caetera Messages postés 234 Date d'inscription Statut Membre Dernière intervention 24

Merci pour ta réponse,

Tu as bien compris, j'aimerais que la fonction champLexHab s'actualise à chaque fois que l'on appuie sur le bouton "clique",

J'ai ajouter var result = champLexHab(); à la fonction afficher mais ça ne change rien :/

J'ai également ajouté document.getElementById('div1').innerHTML = result; mais là ça me donne à chaque fois un résultat undefined à la fonction champLexHab

Pourquoi il ne faut plus utiliser document.write ?

Réponse 3 / 3

jordane45 Messages postés 38480 Date d'inscription Statut Modérateur Dernière intervention 4 746

function champLexHab(){
      var hasard = Math.floor(Math.random()*11);
      var listeDeMots = ['maison', 'appartement', 'porte', 'fenêtre', 'chaise', 'cheminée', 'escalier', 'cuisine', 'salle de bain', 'chambre', 'couloir'];
      return(listeDeMots[hasard])
    }

    function afficher(id){
      
      if(document.getElementById(id).style.visibility="hidden") {
        document.getElementById(id).style.visibility="visible";
        var result = champLexHab();
        console.log(result);
        document.getElementById(id).innerHTML=result;
      } else{
        document.getElementById(id).style.visibility="hidden";
      }
      
      return true;
    }

Caetera Messages postés 234 Date d'inscription Statut Membre Dernière intervention 24

Super merci beaucoup ! Ça fonctionne parfaitement :)

Discussions similaires

Où est la touche SHIFT sur mon clavier d'ordi ?

Quel est la touche shift sur le clavier

ou est la touche shift sur un clavier

Touche "home" sur pc portable.

Arrêt/démarrage via Bouton ON/OFF de l'alim

Votre réponse

Discussions similaires