Pourquoi l'alerte ne s'affiche-t-il pas ?

Version imprimable

Bonsoir à toutes et à tous !

Je ne comprends pas pourquoi mon alerte ne s'affiche. Le problème vient du paramètre ! Car lorsque je passe du numérique aucun problème mais lorsque je passe une chaine de caractère ça ne va plus !

Je pense que cela vient de la concaténation. Pourtant j'ai tout essayé avec le simple quote et double quotes mais rien n'y fait ça ne marche pas. C'est pour ça que je me tourne vers vous.
Code:

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 <html> <head> <title> Javascript - Ex08 </title> <link rel="stylesheet" href="form.css"/> <script Language="Javascript"> function jouer() { /* Declarations des variables */ var saisie; var mot='salut'; /* Affichage de la case de saisie */ saisie=document.getElementById("saisie"); saisie.innerHTML="Lettre choisie</br><input type='text' id='lettre' size=2 onkeyup='choix("+mot+")'/>"; } function choix(mot) { alert(mot); } </script> </head> <body id="corps"> <center> <input TYPE="button" value="Jouer" ONCLICK="jouer()" id="jouer"/> <div id="saisie"></div> </center> </body> </html>
Amicalement crodilus.

Salut tu as oublié les doubles quotes et ses échappements rien de bien grave.

Code:

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
 
<html>
	<head>
		<title> Javascript - Ex08 </title>
		<link rel="stylesheet" href="form.css"/>
		<script Language="Javascript">	
		function jouer()
		{
			/* Declarations des variables */
				var saisie;
				var mot='salut';
 
			/* Affichage de la case de saisie */
				saisie=document.getElementById("saisie");
				saisie.innerHTML="Lettre choisie</br><input type='text' id='lettre' size=2 onkeyup='choix(\""+mot+"\")'/>";
		}
		function choix(mot)
		{
			alert(mot);
		}
		</script>
	</head>
	<body id="corps">
		<center>
			<input TYPE="button" value="Jouer" ONCLICK="jouer()" id="jouer"/>
			<div id="saisie"></div>
		</center>
	</body>
</html>

Bonne soirée

22/10/2012, 20h58
crodilus

Merci bien pour ta réponse !

Mais j'ai encore une question, pourquoi cela fonctionne ainsi et pas comme ceci :

Code:

saisie.innerHTML="Lettre choisie</br><input type='text' id='lettre' size=2 onkeyup='choix(\"+mot+\")'/>";

Car le caractère d'échappement \ permet de retire la fonction au caractère qui le suit. Donc dans le cas que je viens de donner,il devrait permettre au " de ne plus servir de délimitation de chaine ? ! pourquoi encore en rajouter ?

Ou alors il indique que tout les " jusqu'au prochain \" n'auront plus leur effet par défaut ?
22/10/2012, 21h13
Bovino

Lorsque tu écris

Code:

saisie.innerHTML="Lettre choisie</br><input type='text' id='lettre' size=2 onkeyup='choix("+mot+")'/>";

le code HTML correspondant (donc celui qui sera injecté dans la page) sera :

Code:

Lettre choisie</br><input type='text' id='lettre' size=2 onkeyup='choix(salut)'/>

En dehors de l'erreur de syntaxe pour le <br />, tu remarqueras que tu cherches à faire un alert de la variable salut, qui n'existe pas. Donc erreur et pas de message.

Si tu échappes les quotes, le code injecté sera :

Code:

Lettre choisie</br><input type='text' id='lettre' size=2 onkeyup='choix("salut")'/>

c'est-à-dire que JavaScript ne va pas interpréter les quotes (et donc pas fermer la chaine) mais rendra la chaine telle que souhaitée : tu auras bien l'affichage de la chaine passée en paramètre.
22/10/2012, 21h32
headmax
Comme as dit Bovino, lorsque tu click sur le bouton jouer tu génère ce code html :

Citation:

Lettre choisie</br><input type='text' id='lettre' size=2 onkeyup='choix(salut)'/>

La chaine salut n'est pas une chaine string que tu passe a ta fonction, s'est une variable, elle te retourne undefined car elle n'est pas defini.
Si tout en haut de ton code javascript tu la défini, tu pourra utiliser ton script telque tu l'a fait.
par exemple :
Code:

1 2 var salut = "salut";
Te permettra d'avoir le retour string de ta variable.

Bonne soirée.
22/10/2012, 22h12
crodilus

Bon j'ai du mal à comprendre le pourquoi donc voici l'idée que j'ai de la concaténation :

1) choix("+mot+")==>choix(""salut"") : ne fonctionne pas car forme deux chaines vides

2) choix(\"+mot+\")==> choix(+"salut"+) : ne fonctionne pas car concatène la chaine salut à rien du tout

3) choix(\""+mot+"\")==>choix(""salut"") : ce code fonctionne mais je ne comprends pas pourquoi car dans ma tête le résultat de la concaténation est le même que le premier.
22/10/2012, 22h32
headmax
Je double les quotes car il te faut des quotes suplémentaires pour obtenir le fameux (ci dessous) et je les échapes pourqu'il soient prit en compte comme une simple string et donc sera affiché comme un simple caractère dans la chaine du code html généré par js ton code (ligne 14).
Code:

1 2 Lettre choisie</br><input type='text' id='lettre' size=2 onkeyup='choix("salut")'/>
Sinon tu aurait eu :
Code:

1 2 Lettre choisie</br><input type='text' id='lettre' size=2 onkeyup='choix(salut)'/>
Nous n'avons pas d'autre explication :).
Un peu de bon sens voyons ;).
22/10/2012, 23h44
crodilus

Le bons sens vient de tomber je pense !

(\""+mot+"\") ==> (""+"salut"+"") <> (""+salut+"") !
23/10/2012, 12h28
javatwister

de toute façon, appendChild et createElement t'éviteront ce genre de syntaxe pas belle (absence de quotes autour des valeurs d'attributs, simples quotes où on attend des doubles, noms d'éléments en majuscule quand tu récupères le html généré...
23/10/2012, 21h25
crodilus

Éviter cette syntaxe ne me permets pas de comprendre mais je suis d'accord que grâce à ce que tu as dit on peut éviter ma syntaxe.

Je viens de comprendre :

"<input type='text' id='lettre' size=2onkeyup='choix(\""+mot+"\")'/>"
|________________ch1_________________________|_ch2 __|_ch3_|

nos \" sont intégrés à ch1 et ch3 => Donc la concaténation de ch1+ch2+ch3 va renvoyer dans le html "salut" !