JavaScript et la multiplication

**majedz** · 23/11/2012, 16h14

bonjour et merci pour votre coup d'oeil .
j'ai essayé de faire la multiplication par des simple codes en JSP...voici le code:

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
<html>
<head>
<script>
function prod(){
var i=document.getElementById("fr").value;
var j=document.getElementById("sd").value;
var k=i*j;
document.getElementById("rst").innerHTML=k;
}
</script>
</head>
<body>
<p>
<input type="text" id="fr"/>x<input type="text" id="sd"/>=<input type="text" id="rst"/><br/>
<input type="button" value="produit" onclick="prod()"/>
[</p>
</body>
</html>

quand j'exécute cette page...et après avoir appuyer sur le bouton produit...la zone réservée pour l'affichage le produit reste vide....donc il y a quelque chose qui ça va pas

j'attend vos remarques....et merci d'avance.

**SylvainPV** · 23/11/2012, 16h23

Bonjour,

Tout d'abord tu parles de JSP, mais il n'y en a pas dans ton code. Attention aux confusions.

Ensuite, tes input sont de type text. Ce qui signifie que tu peux rentrer des lettres et pas seulement des chiffres. La valeur que tu récupères sera donc une string et pas un int. Tu peux soit utiliser la fonction parseInt :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
 
var i= parseInt(document.getElementById("fr").value);
var j=parseInt(document.getElementById("sd").value);

soit utiliser des <input type="number"> ; mais attention ce type n'est pas implémenté sur tous les navigateurs, donc par prudence mieux vaut rajouter le parseInt

Par ailleurs pour la suite, je t'invite à essayer la console d'erreurs Javascript (celle de chrome accessible par F12 est très bien) pour t'aider à débugger.

**Bovino** · 23/11/2012, 16h33

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

document.getElementById("rst").innerHTML=k;

Un input étant une balise autofermante, elle ne possède pas de innerHTML...

@SylvainPV : si les valeurs des deux input est numérique, la multiplication effectuera elle-même le transtypage. Il n'y a que pour l'addition que ce n'est pas le cas car + est aussi l'opérateur de concaténation.

**pc75** · 23/11/2012, 16h53

Bonjour,

Et comme ça ?

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
 
var i=document.getElementById("fr").value * 1;
var j=document.getElementById("sd").value * 1;
var k=i*j;

**NoSmoking** · 23/11/2012, 17h00

Bonjour,

Envoyé par pc75

Et comme ça ?

relis bien la réponse de Bovino, cela n'est pas utile.

**Bovino** · 23/11/2012, 17h01

Aucune utilité !

Il suffit juste d'affecter le résultat à value au lieu de innerHTML

**sekaijin** · 23/11/2012, 18h03

Waaaarg

je suis un indécrotable

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
 
try {
  var i=parseInt(document.getElementById("fr").value, 10);
  var j=parseInt(document.getElementById("sd").value, 10);
  var k=i*j;
} catch (err) {
   alert('les informations fournies ne sont pas de nombres: ' + err);
}

A+JYT

**SylvainPV** · 23/11/2012, 18h08

Envoyé par Bovino

@SylvainPV : si les valeurs des deux input est numérique, la multiplication effectuera elle-même le transtypage. Il n'y a que pour l'addition que ce n'est pas le cas car + est aussi l'opérateur de concaténation.

Ah, tu viens de m'apprendre un truc ! Donc "2"*"3" === 6
C'est fascinant mais je trouve quand même ça très moche

**Auteur** · 23/11/2012, 19h56

bonjour,

outre la remarque de Bovino sur les produits en javascript :

Envoyé par SylvainPV

donc par prudence mieux vaut rajouter le parseInt

Envoyé par sekaijin

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
 
  var i=parseInt(document.getElementById("fr").value, 10);
  var j=parseInt(document.getElementById("sd").value, 10);
  var k=i*j;

pourquoi parseInt() ?

on ne peut pas faire de multiplication avec des flottants ?

**SylvainPV** · 23/11/2012, 20h52

Envoyé par Auteur

pourquoi parseInt() ?

on ne peut pas faire de multiplication avec des flottants ?

si bien sûr. parseFloat pour les décimaux

**Bovino** · 23/11/2012, 21h11

Bon, ben pour les "indécrottables", l'opérateur de transtypage, c'est +, pas parseInt() ni parseFloat()

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

console.log(typeof +"6");

**sekaijin** · 23/11/2012, 21h49

Oui effectivement
parseInt et parseFloat ne sont pas des opérateur de transtypage

mais pour une saisie soit on transtype est donc cela nessecite une saisie stricte
soit on parse et on accept des petite chose

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
parseInt("10");
parseInt("10.33") ;
parseInt("34 45 66");
parseInt(" 60 ";
parseInt("40 years";
parseInt("He was 40";
 
parseInt("10",10);
parseInt("010");
parseInt("10",8);
parseInt("0x10");
parseInt("10",16);

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

alors que certaine de ces valeurs vont généré une erreur avec un transtypage
A+JYT

**Bovino** · 23/11/2012, 22h04

En même temps, tu n'avais pas parlé de transtypage toi !

Je voulais juste chipoter, mais comme toujours, tes commentaires sont précis et judicieux !

**majedz** · 24/11/2012, 10h19

merci à : SylvainPV,Bovino,pc75,NoSmoking,sekaijin etAuteur pour vos bonnes interventions et pour vos explications.
le problème est bien résolu en se basant sur vos analyses....le code final est comme suit :

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
<html>
<head>
<script>
function prod(){
var i=parseFloat(document.getElementById("fr").value);
var j=parseFloat(document.getElementById("sd").value);
var k=i*j;
document.getElementById("rst").value=k;
}
</script>
</head>
<body>
<p>
<input type="text" id="fr"/>x<input type="text" id="sd"/>=<input type="text" id="rst"/><br/>
<input type="button" value="produit" onclick="prod()"/>
</p>
</body>
</html>

et après l’exécution, le résultat était parfait.
encore merci beaucoup pour votre collaboration.

JavaScript et la multiplication

JavaScript

Discussions similaires

Partager

Partager