Calcul dans une page html

**subfestivus** · 11/10/2014, 13h31

Bonjour ,

je souhaiterai dans une page html réaliser un calcul , un champ "volume" pour rentrer une valeur , un second champ "pourcentage" pour une valeur et un bouton pour afficher le résultat dans la page.
le résultat du calcul serait la valeur du champ volume * par la valeur du champ pourcentage /100

Pouvez-vous m'apporter un début de code svp ?
Merci de votre expertise

**Auteur** · 11/10/2014, 13h38

Bonjour,

il faut du HTML pour la mise en page et les composant de type "input" ou "button". Un fonction javascript servira à lire le contenu des inputs, réaliser le calcul et afficher le résultat. Voilà pour le principe.

Pouvez-vous m'apporter un début de code svp ?

Peut-on voir ce que tu as déjà fait car la politique du forum n'est pas justement de pas réaliser les exercices. On préfère donner un coup de main et aider les débutants à comprendre leurs erreurs en s'appuyant sur ce qui a été fait. Cette méthode est beaucoup plus pédagogique.

Avec les indices que je t'ai donné, réalise d'abord le code HTML avec les composants nécessaires, puis intègre le code javascript.

**subfestivus** · 11/10/2014, 13h49

Code html :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Document sans nom</title>
</head>
 
<body>
<label for="Volume d'eau">Text Field:</label>
<input type="text" name="Volume" id="textfield">
<label for="Pourcentage">Text Field:</label>
<input type="text" name="porcentage" id="textfield2">
<input type="button" name="button" id="button" value="calculer">
</body>
</html>

**subfestivus** · 11/10/2014, 17h24

Code html :

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
19
20
21
22
23
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Document sans nom</title>
</head>
 
<body>
<label for="textfield">Volume d'eau:</label>
<input type="text" name="Volume" id="textfield">
<label for="textfield2">Pourcentage:</label>
<input type="text" name="Pourcentage" id="textfield2">
<input type="button" name="button" id="button" value="Envoyer"><script language="JavaScript" type="text/javascript"> 
 
<?php
$var1 = 'Volume';
$Var2 = 'Pourcentage';
echo  "$var1* $Var2 /100";        
 
?>
 
</body>
</html>

**subfestivus** · 11/10/2014, 18h42

Code html :

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
19
20
21
22
23
24
25
26
27
28
29
30
<html>
<head>
		<script type="text/javascript">
                        function Calcul(){
                                var a = document.getElementById('id1').value ;
                                var b = document.getElementById('id2').value ;
                                var c = 100
                                document.getElementById('id3').value =  parseFloat(a) *  parseFloat(b) /parseFloat(c);
                        };
                </script>
	</head>
<body bgcolor="#3399FF">
	<form>
 
			<input TYPE="number" ID="id1" style="width:60px; height:20px;" name="duree" value="" /> 
			<input TYPE="number" ID="id2" style="width:60px; height:20px;" name="duree" value="" /> 
			<input TYPE="number" ID="id3"  disabled="disabled" style="width:60px; height:20px;" name="duree" value="" /> 
			<input type="button" onClick="Calcul();" value="Calcul" /> 
</form>
</body>
</html><!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Document sans nom</title>
</head>
 
<body>
</body>
</html

**Auteur** · 11/10/2014, 20h05

bonsoir,

lequel de ces 3 exemples je dois prendre ? Pourquoi du PHP dans le second ?
Quel sont les soucis que tu rencontres ?

Calcul dans une page html

Vue hybride

Discussions similaires

Partager

Partager