1. Accueil
  2. Forum Codes-Sources
  3. Javascript / DHTML
Sujet Précédent Sujet Suivant

Problème de débutante

Résolu
veroderberg
Messages postés
6
Date d'inscription
mercredi 18 février 2015
Statut
Membre
Dernière intervention
6 mars 2015
 - Modifié par kazma le 18/02/2015 à 10:55
veroderberg
Messages postés
6
Date d'inscription
mercredi 18 février 2015
Statut
Membre
Derniè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>

3 réponses

Réponse 1 / 3
jordane45
Messages postés
35767
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
1 juillet 2022
 358
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.

1
Réponse 2 / 3
jordane45
Messages postés
35767
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
1 juillet 2022
 358
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!)



1
veroderberg
Messages postés
6
Date d'inscription
mercredi 18 février 2015
Statut
Membre
Derniè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>");

0
@karamel
Messages postés
1807
Date d'inscription
vendredi 9 mai 2008
Statut
Modérateur
Dernière intervention
5 mai 2022
 144 > veroderberg
Messages postés
6
Date d'inscription
mercredi 18 février 2015
Statut
Membre
Derniè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.
0
veroderberg
Messages postés
6
Date d'inscription
mercredi 18 février 2015
Statut
Membre
Dernière intervention
6 mars 2015
19 févr. 2015 à 15:32
Merci!
0
Réponse 3 / 3
jordane45
Messages postés
35767
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
1 juillet 2022
 358
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>");



1