[JAVASCRIPT + HTML] Problème fonction Return

Problème fonction Return [JAVASCRIPT + HTML] - HTML/CSS - Programmation

Marsh Posté le 19-11-2013 à 15:18:45    

Bonjour à tous et à toutes!
 
Je me permets de publier ce post, car étant débutant en Java j'ai voulu refaire un exercice de cours...et cela ne fonctionne pas.
Il s'agit d'une page HTML devant effectuer des calculs en fonction des chiffres que l'on indique dans les input ; une calculatrice en gros.
 
J'ai pourtant refait EXACTEMENT la même manipulation que l'exo que j'ai fait un cours la semaine passée (et qui,lui,fonctionne parfaitement)
Peut-être s'agit-il d'un souci de syntaxe (j'ai souvent des problèmes avec la ponctuation, même en français)
Je pense que le souci vient de la fonction return, d'où le titre de mon post.
 
Merci d'avance.
 
Page HTML :
<html>
 <head>
  <title> Petit entraînement </title>
  <script type="text/javascript" src="CalculJ.js"></script>
 </head>
 <body>
  <h1> Formulaire </h1>
  <label> Veuillez entrer le premier chiffre </label>
  <input id="chiffre1" type="number" value=""/>
   
  <p>
  <label> Veuillez entrer le deuxième chiffre </label>
  <input id="chiffre2" type="number" value=""/>
  <p/>
   
  <p>
  <label> Veuillez entrer le troisième chiffre </label>
  <input id="chiffre3" type="number" value=""/>
  </p>
   
  <p>
  <input type="button" value="C'est parti !" onclick="calcul()"/>
  </p>
   
  <div id="solution">
  </div>
 </body>
</html>
   
Page JAVA :
 
function calcul()
{c1=document.getElementById ('chiffre1').value
c2=document.getElementById('chiffre2').value
c3=document.getElementById('chiffre3').value
document.getElementById('solution').innerHTML=calculator(c1,c2,c3);
}
 
function calculator (d1,d2,d3)
{a= '<p>'+d1+'+ '+d2+'+ '+d3+"= "+(d1++d2++d3)+'</p>';
m= '<p>'+d1+'x '+d2+'x '+d3+"= "+(d1*d2*d3)+'</p>';
s='<p>'+d1+'- '+d2+'- '+d3+'= '+(d1-d2-d3)+'</p>';
d='<p>'+d1+'/ '+d2+'/ '+d3+'='+(d1/d2/d3)+'</p>';
return(a+m+s+d);
}


Message édité par kimi25 le 19-11-2013 à 22:15:16
Reply

Marsh Posté le 19-11-2013 à 15:18:45   

Reply

Marsh Posté le 19-11-2013 à 19:09:12    

C'est pas du Java, c'est du Javascript, deux langages qui n'ont rien a voir, change ta balise...
 
Sinon pour ton probleme, il faudrait que tu nous dise en quoi ca ne marche pas. Tu fais quoi, tu t'attends a quoi et tu as quoi a la place? Y a-t-il un message d'erreur quelque part?
 
As-tu essaye de mettre des alert() dans ta fonction calculator() pour verifier d'une part que tu y accedes, et d'autre part la tete des tes resultats intermediaires?


---------------
C'était vraiment très intéressant.
Reply

Marsh Posté le 19-11-2013 à 22:16:47    

Oui, pardon, en fait je peux donc entrer mes 3 input (les 3 chiffres), le bouton de validation existe, mais quand je clique dessus il ne se passe rien.
 
J'ai pas essayé pour alert car on ne l'a pas encore fait en cours ; dans l'exemple que j'ai on ne l'a pas utilisé et ça fonctionne quand même.

Reply

Marsh Posté le 20-11-2013 à 00:10:43    

Dans ta fonction calculator, tu as

Code :
  1. function calculator (d1,d2,d3)
  2. {a= '<p>'+d1+'+ '+d2+'+ '+d3+"= "+ (d1++d2++d3) + '</p>';
  3. m= '<p>'+d1+'x '+d2+'x '+d3+"= "+(d1*d2*d3)+'</p>';
  4. s='<p>'+d1+'- '+d2+'- '+d3+'= '+(d1-d2-d3)+'</p>';
  5. d='<p>'+d1+'/ '+d2+'/ '+d3+'='+(d1/d2/d3)+'</p>';
  6. return(a+m+s+d);
  7. }


mais ca doit être

Code :
  1. function calculator (d1,d2,d3)
  2. {
  3.   var a = '<p>'+d1+'+ '+d2+'+ '+d3+"= "+ (d1+d2+d3) + '</p>',
  4.     m= '<p>'+d1+'x '+d2+'x '+d3+"= "+(d1*d2*d3)+'</p>',
  5.     s='<p>'+d1+'- '+d2+'- '+d3+'= '+(d1-d2-d3)+'</p>',
  6.    d='<p>'+d1+'/ '+d2+'/ '+d3+'='+(d1/d2/d3)+'</p>';
  7.   return (a + m + s + d);
  8. }


 
Il suffit en fait de regarder la console javascript (dispo sur tout les navigateurs, même IE), et l'erreur serait apparue.
Attention aussi aux variables globales. En javascript, si tu ne precedes pas tes variables par le mot clé "var", elles sont considerées comme globales, ce qui est tres mauvais, car source d'erreurs à caractère casse-cou*lles :o


Message édité par SICKofitALL le 20-11-2013 à 00:11:47

---------------
We deserve everything that's coming...
Reply

Marsh Posté le 20-11-2013 à 12:34:20    

Bonjour,
 
Merci de ta réponse mais même en essayant avec le nouveau code, cela ne fonctionne toujours pas...l'erreur ne viendrait-elle pas du HTML, tout simplement?

Reply

Marsh Posté le 20-11-2013 à 14:00:57    

C'est quoi qui fonctionne pas ? Le alert va te servir à afficher un message, met donc un alert à la place du return pour voir ce que ça te dit.

 

En tout cas manque des ";" dans ta fonction calcul() soit : c1=document.getElementById ('chiffre1').value ;


Message édité par Pablo Escrobarbe le 20-11-2013 à 15:35:29
Reply

Marsh Posté le 20-11-2013 à 15:32:39    

kimi25 a écrit :

Bonjour,

 

Merci de ta réponse mais même en essayant avec le nouveau code, cela ne fonctionne toujours pas...l'erreur ne viendrait-elle pas du HTML, tout simplement?


Salut

 

j'ai essayé ce code chez moi, et ca fonctionne !
Si tu as une erreur, quelle est-elle ? (erreur de frappe ?)


Message édité par SICKofitALL le 20-11-2013 à 15:33:14

---------------
We deserve everything that's coming...
Reply

Marsh Posté le 20-11-2013 à 15:43:57    

Code :
  1. function calcul() {
  2.   c1 = document.getElementById('chiffre1').value;
  3.   c2 = document.getElementById('chiffre2').value;
  4.   c3 = document.getElementById('chiffre3').value;
  5.   document.getElementById('solution').innerHTML = calculator(c1,c2,c3);
  6. }
  7. function calculator (d1,d2,d3) {
  8.   a = '<p>'+d1+' + '+d2+' + '+d3+' = '+(d1+d2+d3)+'</p>';
  9.   m = '<p>'+d1+' x '+d2+' x '+d3+' = '+(d1*d2*d3)+'</p>';
  10.   s = '<p>'+d1+' - '+d2+' - '+d3+' = '+(d1-d2-d3)+'</p>';
  11.   d = '<p>'+d1+' / '+d2+' / '+d3+' = '+(d1/d2/d3)+'</p>';
  12.   return(a+m+s+d);
  13. }


 
Déjà reste cohérent dans ton écriture : point-virgules, espacements, simple guillemets.
Parce que là c'est une fois j'en mets une autre fois je n'en mets pas.
 
EDIT : avec des points-virgules en bout de ligne et une syntaxe cohérente ça fonctionne, enfin presque, tu seras à amener à convertir tes données pour faire des calculs dessus.


Message édité par MaybeEijOrNot le 20-11-2013 à 15:50:41
Reply

Marsh Posté le 21-11-2013 à 10:19:38    

cela fonctionne maintenant ; merci beaucoup!
 
Petite précision, au lieu d'inscrire
a = '<p>'+d1+' + '+d2+' + '+d3+' = '+(d1+d2+d3)+'</p>';
 
J'ai inscrit a= '<p>'+d1+'+ '+d2+'+ '+d3+'= '+(d1- -d2- -d3)+'</p>';   qui fonctionne également
 
Bonne continuation dans le monde HTML,
 
A bientôt

Reply

Marsh Posté le 21-11-2013 à 11:42:29    

Ok :)
 
Par contre, si on est d'accord que (1 + 1) et (1 - -1) font 2 (maths de base), la premiere formulation est plus "logique" que la seconde ;)


---------------
We deserve everything that's coming...
Reply

Marsh Posté le 21-11-2013 à 11:42:29   

Reply

Marsh Posté le 21-11-2013 à 14:24:23    

Son problème c'est que (1 + 1) ne faisait pas 2 mais 11 car les nombres étaient considérés comme des chaines de caractères et il ne doit pas savoir convertir des chaines de caractères en nombre, du coup il a trouvé une bidouille.

Reply

Marsh Posté le 21-11-2013 à 14:48:10    

Pas sur, au vu de l'histoire de "d1- -d2- -d3", je crois que le soucis principal venait du fait que  
(d1++d2++d3)
est décomposé par le parser en
(d1++ d2++ d3)
alors qu'il voulait surement dire
(d1+ +d2+ +d3)
 
Et de tte facon, le coup de la concaténation de string au lieu d'une addition classique risque grandement d'arriver, puisqu'il n'y a aucun "nettoyage" des vars qui viennent de l'user.
Sauf si les vars sont préfixées par un signe + (par exemple, +"0" renvoit bien le Number 0), d'où ptêtre la syntaxe (d1+ +d2+ +d3).
 
C'te pavé ! :D


---------------
We deserve everything that's coming...
Reply

Marsh Posté le 21-11-2013 à 16:11:06    

"Son problème" faisait référence au --=+ et non au problème d'origine. Oui autrement à l'origine le problème venait du "++".

Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed