- Sign up X













- Reporting X


Illegal content, SPAM or insults, can you explain the problem of this message

< Computing - Computer, software, hacks, help, questions /

Probléme variable = undefined

Bonjour,
Débutant en Javascript j'ai décidé d'essayé de faire une calculatrice en Javascript afin de m'exercer...
Je rencontre un problème auquel je ne trouve pas de solution j'ai pourtant cherché dans les différents cours mais en vain... Donc voici mon code 

‎<form>
    <input type="number" id="nbr1" placeholder="Entrez le premier chiffre" />
       <input type="number" id="nbr2" placeholder="Entrez le second chiffre"/><br/>
       Choisissez l'opération :
       <input type="button" id="addition" value="+"/>
       <input type="button" id="moins" value="-"/>
       <input type="button" id="fois" value="X"/>
       <input type="button" id="modulo" value="modulo %" />
       <input type="button" id="egal" value="=" />
</form>
Résultat :
   <script src="calculatrice.js">
</script>

Et le script en JS qui bug : 

‎document.getElementById('addition').addEventListener('click',addition);
    document.getElementById('moins').addEventListener('click',moins);
    document.getElementById('fois').addEventListener('click',multi);
    document.getElementById('modulo').addEventListener('click',modu);
    document.getElementById('egal').onclick=resultat;
    var add="0";
    var min="0";
    var mul="0";
    var mod="0";
    function addition(mod,mul,add,min){
     add="1";
     min="0";
     mul="0";
     mod="0";
    }
    function moins(mod,mul,add,min){
     min="1";
     add="0";
     mul="0";
     mod="0";
    }
    function multi(mod,mul,add,min){
     mul="1";
     min="0";
     add="0";
     mod="0";
    }
    function modu(mod,mul,add,min){
     mod="1";
     add="0";
     min="0";
     mul="0";
    }
    function resultat (nbr1,nbr2, mod, mul, add, min,result)
    {
      var nbr2= document.getElementById("nbr2").value;
      var nbr1= document.getElementById("nbr1").value;
       if (add=="1") {
        var result=nbr1+nbr2;
         alert(result);
       }
       else if (min=="1") {
        var result=nbr1-nbr2;
         alert(result);
       }
       else if (mul=="1"){
        var result=nbr1*nbr2;
         alert(result);
       }
       else if (mod=="1") {
        var result=nbr1%nbr2;
        alert(result);
       }
       else
       {
        alert("Aucune opération n'a été selectionnée");
       }
      alert (add);
      }

Bon j'ai deux alert afin de vérifier mes script un qui me donne la valeur de add à la fin et un qui me donne DEVRAIT me donner le résultat.
Sauf que j'ai toujours "Undefined" comme réponse à la valeur de add alors que je clique bien.
J'ai essayé plusieurs choses :
Changer les 0 et les 1 en true et false
enlever et remettre des var un peut partout
faire avec d'autres opérations
Merci d'avance de votre aide

Posted by anonyme on Sun, May 24, 2020 at 04:34 pm
 
Answer(s)
   6 messages  ●  
Page 1
From anonyme
Sun. May 24, 2020-04:34 pm
Salutation!
J'ai aussi fais une calculette en Javascript, et l'erreur m'est apparue une fois et il me semble que tu additionnes deux string et non Int...
From anonyme
Sun. May 24, 2020-04:35 pm
Voilà ce que j'ai fais 

‎var nbr2= parseFloat(document.getElementById("nbr2").value);
      var nbr1= parseFloat(document.getElementById("nbr1").value);<br><br>

Mais ça ne résout pas le problème de la variables add qui est undefined :/
From anonyme
Sun. May 24, 2020-04:35 pm
Par définition, undefined signifie que ta variable "add" n'est tout simplement pas calculée, ou pas déclarée...
From anonyme
Sun. May 24, 2020-04:35 pm
Oui je suis d'accord mais si je fais une alert(add) dans la fonction "addition" là elle à la bonne valeur et est déclarée
From anonyme
Sun. May 24, 2020-04:35 pm
Ah cela change la donne... Dans quoi affiche tu "add"?
From anonyme
Sun. May 24, 2020-04:39 pm
Si les variables add, mul, min et mod sont des variables globales déclarées initialement, il ne faut plus les faire figurer en arguments des fonctions correspondantes, ni même en argument de la fonction résultat (car alors elles deviennent locales et non définies dans ces fonctions). Autrement dit, il convient d'effacer tous les arguments de ces fonctions pour que le script fonctionne.
Par ailleurs, de simples signes + devant les valeurs des zones de textes (qui produisent logiquement des chaînes de caractères) forcerait la transcription en Numbers.

‎var nbr2= +document.getElementById("nbr2").value;
var nbr1= +document.getElementById("nbr1").value;

Ces variables sont locales à la fonction résultat.
S'il fallait utiliser un code (numérique plutôt que textuel) pour l'opération et une seule fonction, reprenant ce code en argument, le scenario pourrait être le suivant :

‎<!DOCTYPE html>
<html>
<meta charset="utf-8">
<head><title>Calculette</title>
<style type="text/css">
body{padding:20px;background:#000}
#pge {display;block;width:300px;margin:0 auto;padding:7px;background:#ccc;font-size:x-large}
p{margin:3px;text-align:center;}
input{text-align:center;font-size:large}
.red {color:#f00;font-weight:bold;}
.btn {width:30;height:30px;margin:3px;font-weight:bold;}
</style>
</head>
<body>
<div id="pge"><fieldset><legend>Calculette</legend>
   <p><input type="number" id="nbr1" placeholder="Entrez le premier chiffre"></p>
   <p><input type="number" id="nbr2" placeholder="Entrez le second chiffre"></p>
    <p><span id="rsl" class="red"></span></p>
   <p><input class="btn" type="button" id="addition" value=" + " onclick="calcule(1)">
   <input class="btn" type="button" id="moins" value=" - " onclick="calcule(2)">
   <input class="btn" type="button" id="fois" value=" x " onclick="calcule(3)">
   <input class="btn" type="button" id="modulo" value=" % " onclick="calcule(4)"></p>
</fieldset></div>
<p>Résultat : <span id="rsl" class="red"></span></p>
<script>
/* Codes des opérations
    1 => addition
    2=> soustraction
    3=> multoiplication
    4=> modulo
*/
function calcule (code){var resultat;
      var nbr2= +document.getElementById("nbr2").value;
      var nbr1= +document.getElementById("nbr1").value;
        switch(code){
            case 1:resultat=nbr1+nbr2;break;
            case 2:resultat=nbr1-nbr2;break;
            case 3:resultat=nbr1*nbr2;break;
            case 4:resultat=nbr1%nbr2;break;
        }
        document.getElementById('rsl').innerHTML=resultat;
}
</script>
</body>
</html>

Enfin, contrairement aux indications souvent prodiguées, par des gens qui s'imaginent enseigner à des développeurs professionnels, les complications tendant à séparer styles, scripts et HTML sont le plus souvent à éviter, notamment lorsque les pages sont uniques.
Pour ma part, j'opterai pour la notation polonaise inverse https://fr.wikipedia.org/wiki/Notation_polonaise_inverse disponibles sur les anciennes calculettes Hewlett-Packard. Il conviendrait alors de gérer une pile de 4 valeurs (x, y, z et t en montant), la seule valeur x étant affichée au dessus des boutons.
Les entrées se font alors dans x (pile x,0,0,0), sauf flèche vers le haut (pile:x, x,0, 0) pour une nouvelle entrée, qui (sauf opération +=>2*x,0,0,0; x=>x*x,0, 0, 0;...) conduit à la pile y,x,0,0, les opérations portent maintenant sur x et y. Il convient alors de prévoir une touche d'échange x<=>y, une flèche vers le bas (la case t se reproduisant alors en z : t, z, y, x => t, t, z, y) pour faire descendre la pile ... etc.  
< Computing - Computer, software, hacks, help, questions /


   6 messages  ●  
Page 1
You must be logged in, to post