veroderberg
Messages postés6Date d'inscriptionmercredi 18 février 2015StatutMembreDernière intervention 6 mars 2015
-
Modifié par kazma le 18/02/2015 à 10:55
veroderberg
Messages postés6Date d'inscriptionmercredi 18 février 2015StatutMembreDernière intervention 6 mars 2015
-
19 févr. 2015 à 15:32
Bonjour,
Je commence à peine à programmer, pour le plaisir. J'essaie de faire une petite application en html/javascript, un peu à la va-comme-je-te-pousse, en grapillant des infos par-ci et par-là...
Mon code fonctionnait jusqu'à ce que j'y ajoute les 4-5 lignes qui commencent par // ci-dessous (35 à 41). Quand j'enlève les // pour tenter d'exécuter ces lignes, plus rien n'apparaît sauf le titre... J'arrive pas à comprendre pourquoi.
Dans un autre ordre d'idées, je remarque que ça ne change rien si je mets des points-virgules ou pas. Faut-il vraiment en mettre?
Merci de votre aide! N'hésitez pas à commenter tout ce qui n'a pas d'allure également!
<body>
<h1>Brownie dans une tasse</h1>
<form name="parametres">
J''ai une <select name="faim"><option value=" "> </option><option value="small">petite</option><option value="medium">moyenne</option><option value="large">grosse</option></select> fringale.<br>
Mon micro-ondes a une puissance de <select name="puissance"><option value=" "><option value=600>600</option><option value=650>650</option><option value=700>700</option><option value=750>750</option><option value=800>800</option><option value=850>850</option><option value=900>900</option><option value=950>950</option><option value=1000>1000</option><option value=1050>1050</option><option value=1100>1100</option><option value=1150>1150</option><option value=1200>1200</option></select> watts<br>
Mesures <select name="units"><option value="0">métriques</option><option value="1">impériales</option></select>
<input type="button" name="bouton" value="Générer la recette" onclick="portion()">
</form>
<script type="text/javascript">
function portion() {
watts = document.parametres.puissance.value
i = document.parametres.faim.selectedIndex
if (i == 1){
multiplicateur = 10
}
if (i == 2){
multiplicateur = 15
}
if (i == 3){
multiplicateur = 20
}
mult = parseInt(multiplicateur)
document.write("<html><head><meta charset='utf-8' /><meta name='format-detection' content='telephone=no' /><meta name='msapplication-tap-highlight' content='no' /><meta name='viewport' content='user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi' /><link rel='stylesheet' type='text/css' href='css/index.css' /><title>La machine à gâteau</title></head>")
document.write("<body><h1>Brownie dans une tasse</h1>")
// x = document.parametres.units.selectedIndex
// if (x == 0){
// factor = mult*1
// }
// else {
// factor = mult/5
// }
document.write(mult*2+" ml farine<br>")
document.write(mult*1+" ml cacao<br>")
document.write(mult*1+" ml sucre<br>")
document.write(mult*1+" ml cassonade<br>")
document.write(mult*1+" ml lait<br>")
document.write(factor*1+" ml huile<br>")
document.write(factor*0.05+" ml extrait de vanille<br>")
document.write(factor*1+" ml pépites de chocolat, noix ou autre (facultatif)<br>")
document.write("<br>"+mult*23+" calories")
w = parseInt(watts)
temps_medium = 50
temps = 700/w*temps_medium*mult/15
duree = Math.round(temps*0.1)/0.1
document.write("<br>Temps de cuisson : "+duree+" secondes")
document.write("<br><input type='button' value='Recommencer' onclick='window.location.reload()'></body></html>")
}
</script>
</body>
jordane45
Messages postés37538Date d'inscriptionmercredi 22 octobre 2003StatutModérateurDernière intervention 7 juin 2023341 18 févr. 2015 à 08:59
Bonjour
les points virgules ? Oui il faut les mettre.
Pour ce qui est de ton souci. .. commence par utiliser les outils de debogage de ton navigateur internet (je te conseille le plugin Firebug pour firefox )
ça t'indiquera les erreurs de script.
jordane45
Messages postés37538Date d'inscriptionmercredi 22 octobre 2003StatutModérateurDernière intervention 7 juin 2023341 18 févr. 2015 à 09:37
Le souci est l'emplacement du code ....
tu réécris le document juste avant... donc ton form n'existe plus....
Dans l'idéal.. voici comment j'aurais écrit ton code :
<script type="text/javascript">
function portion() {
// récupération des éléments du formulaire
var parametres = document.parametres;
var puissance = parametres.puissance
var faim = parametres.faim;
var units = parametres.units;
//récupération des valeurs
var watts = puissance.value;
var faimVal = faim.selectedIndex;
var unite = units.selectedIndex;
//début du traitement
var i = faimVal
if (i == 1){
multiplicateur = 10;
}
if (i == 2){
multiplicateur = 15;
}
if (i == 3){
multiplicateur = 20;
}
var mult = parseInt(multiplicateur);
document.write("<html><head><meta charset='utf-8' /><meta name='format-detection' content='telephone=no' /><meta name='msapplication-tap-highlight' content='no' /><meta name='viewport' content='user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi' /><link rel='stylesheet' type='text/css' href='css/index.css' /><title>La machine à gâteau</title></head>");
document.write("<body><h1>Brownie dans une tasse</h1>");
var x = unite;
if (x == 0){
factor = mult*1;
}
else {
factor = mult/5;
}
document.write(mult*2+" ml farine<br>");
document.write(mult*1+" ml cacao<br>");
document.write(mult*1+" ml sucre<br>");
document.write(mult*1+" ml cassonade<br>");
document.write(mult*1+" ml lait<br>");
document.write(factor*1+" ml huile<br>");
document.write(factor*0.05+" ml extrait de vanille<br>");
document.write(factor*1+" ml pépites de chocolat, noix ou autre (facultatif)<br>");
document.write("<br>"+mult*23+" calories");
var w = parseInt(watts);
var temps_medium = 50;
var temps = 700/w*temps_medium*mult/15;
var duree = Math.round(temps*0.1)/0.1;
document.write("<br>Temps de cuisson : "+duree+" secondes");
document.write("<br><input type='button' value='Recommencer' onclick='window.location.reload()'></body></html>");
}
</script>
Tu remarqueras que j'ai mis devant chaque variable le mot VAR
et qu'à la fin de chaque ligne j'ai ajouté un ";"
Ceci est OBLIGATOIRE si tu souhaites que ton code fonctionne sur TOUS les navigateurs (surtout internet explorer!)
veroderberg
Messages postés6Date d'inscriptionmercredi 18 février 2015StatutMembreDernière intervention 6 mars 2015 19 févr. 2015 à 04:01
Merci pour votre réponse! Effectivement, en modifiant l'emplacement du code pour le mettre avant les document.write(...), ça fonctionne.
Je suis presque arrivée à un résultat satisfaisant, mais j'ai encore un petit souci. Le premier bouton, pour réinitialiser, fonctionne. Je voudrais que le deuxième bouton me ramène à index.html, mais j'ai essayé plein de trucs dans onclick, sans succès. Pouvez-vous m'éclairer? J'ai remarqué que quand je mets des guillemets doubles à l'intérieur d'autres guillemets doubles dans document.write(), tout plante, alors je ne sais plus trop comment écrire mon lien. Merci d'avance!
document.write("<br><input type='button' value='Modifier les paramètre' onclick='window.location.reload()'>"); document.write("<br><input type='button' value='Trouver une nouvelle recette' onclick=XXXXXXXX;"></body></html>");
@karamel
Messages postés1830Date d'inscriptionvendredi 9 mai 2008StatutModérateurDernière intervention 2 juin 2023147
>
veroderberg
Messages postés6Date d'inscriptionmercredi 18 février 2015StatutMembreDernière intervention 6 mars 2015 19 févr. 2015 à 11:09
bonjour pour le retour a index.html utilise location.href
document.write("<br><input type='button' value='Trouver une nouvelle recette' onclick=location.href='chemin_du _fichier_html';"></body></html>");
quand aux quotes utilise les simple quote a l'interieur des doubles.
veroderberg
Messages postés6Date d'inscriptionmercredi 18 février 2015StatutMembreDernière intervention 6 mars 2015 19 févr. 2015 à 15:32
jordane45
Messages postés37538Date d'inscriptionmercredi 22 octobre 2003StatutModérateurDernière intervention 7 juin 2023341 19 févr. 2015 à 11:04
Bonjour,
Normalement... ici... on ne pose qu' UNE seule question par discussion.
La question initiale étant résolue... il aurait été souhaitable que tu créé une nouvelle discussion pour cette nouvelle question..
Mais bon, on va quand même la traiter ici.
J'ai remarqué que quand je mets des guillemets doubles à l'intérieur d'autres guillemets doubles dans document.write(), tout plante
C'est normal.... tu peux mixer des simples quotes avec des doubles quotes ( ce que tu fais déjà) et quand tu as déjà les deux dans une même "string" il faut utiliser des caractères d'échappement pour en ajouter d'autres...
ce qui dans ton cas revient à :
document.write("<br><input type='button' value='Trouver une nouvelle recette' onclick= 'window.location = \"index.html\"'></body></html>");