Formulaire calcul HTML + JS [Résolu/Fermé]

Signaler
Messages postés
40
Date d'inscription
dimanche 30 juin 2002
Statut
Membre
Dernière intervention
26 juillet 2018
-
Messages postés
40
Date d'inscription
dimanche 30 juin 2002
Statut
Membre
Dernière intervention
26 juillet 2018
-
Bonjour,
Ne connaissant pas du tout la programmation Java Script, je demande votre aide afin de compléter la conversion de mon site en application mobile.
Je voudrais sur une page créer un formulaire (champs de valeurs) en HTML, dans lequel on puisse rentrer une valeur,puis en cliquant sur un bouton "entrée" avoir dans un autre champ le résultat de cette opération (une division) ex: nombres d'hectolitres: 50 ; résultat : 6666.6 bouteilles de 75cl. (50/0.0075).
Merci pour votre aide.

5 réponses

Messages postés
1377
Date d'inscription
mercredi 18 mars 2009
Statut
Membre
Dernière intervention
5 mars 2020
183
salut! un petit script avec formulaire que je te propose :

<form>
<input type="text" id="nbhl" placeholder="Nombre d'hectolitres"/>
<input type="button" value="Calculer" onclick="javascript:document.getElementById('resultat').innerHTML=document.getElementById('nbhl').value/0.0075+' bouteilles de 75 cl.';"/>
<p id="resultat"></p>
</form>

7
Merci

Quelques mots de remerciements seront grandement appréciés. Ajouter un commentaire

CCM 76687 internautes nous ont dit merci ce mois-ci

Messages postés
40
Date d'inscription
dimanche 30 juin 2002
Statut
Membre
Dernière intervention
26 juillet 2018
2
Merci beaucoup totodunet pour la rapidité de réponse et le résultat. C'est tout à fait ce que je recherchais :-))
Petite amélioration... la page peut-elle s'ouvrir avec déjà le pointeur à l'intérieur du champ à remplir ? que la personne n'est qu'à rentrer un chiffre sans avoir à pointer le champ en premier ?
Merci, et bonne soirée.
Messages postés
1377
Date d'inscription
mercredi 18 mars 2009
Statut
Membre
Dernière intervention
5 mars 2020
183
no problem, toujours du JS, dans la balise body rajouter :

<body onload="javascript:document.getElementById('nbhl').focus();">

...

</body>

Messages postés
1377
Date d'inscription
mercredi 18 mars 2009
Statut
Membre
Dernière intervention
5 mars 2020
183
plus simple ! juste en html :

<input type="text" id="nbhl" placeholder="Nombre d'hectolitres" autofocus/>

il me semblait bien qu'il existait cet attribut là^^ je l'avais déjà utilisé quand je connaissais pas le JS. c'est une des nouveautés du HTML5

si ta page est en XHTML il faut mettre à la place autofocus="autofocus"

source : https://www.w3schools.com/tags/att_input_autofocus.asp

Qui ne tente rien n'a rien
Messages postés
40
Date d'inscription
dimanche 30 juin 2002
Statut
Membre
Dernière intervention
26 juillet 2018
2
Impeccable !Merci beaucoup Totodunet, sujet résolu.