codage avec js

Version imprimable

codage avec js

Bonjour, ou bonsoir,
Je me présente jérôme, je suis sur un projet d'un script en js,
permettant de faire des comparaisons d'une variable, exemple:

Si la valeur taper se trouve entre 0 et 50 affiche une image + le chiffre taper sur l'image.

Pour le moment j'ai mon script qui ne fait qu'afficher les 2 première image de mes 2 première comparaison et aussi de ma dernière,
mais pas ceux de 91 a 150 et les autre, sa doit venir de mes if, sa j'en suis sûr, mais bon je débute en js donc un peu difficile le début j'avoue,
j'aimerai juste avoir votre opinion sur mon script et aussi m'orienté sur mon erreur.

Mon script complet:
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 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 <HTML> <HEAD> <TITLE> </TITLE> <script language="JavaScript"> function validation(f) { if (f.val.value >='0' && f.val.value <= '50') { first_image =new Image(477,437) first_image.src="images/1.jpg"; document.write('<img src="'+first_image.src+'" border="0" alt="test">'); return false; } if (f.val.value >='51' && f.val.value <= '90') { alert ("de 51 a 90"); return false; } if (f.val.value >='91' && f.val.value <= '150') { alert ("de 91 a 150"); return false; } if (f.val.value >='151' && f.val.value <= '230') { alert ("de 151 a 230"); return false; } if (f.val.value >='231' && f.val.value <= '330') { alert ("de 231 a 330"); return false; } if (f.val.value >='331' && f.val.value <= '450') { alert ("de 331 a 450"); return false; } if (f.val.value >'451') { alert ("plus de 450"); return false; } } </script> </HEAD> <BODY> <form method="post" onsubmit="return validation(this)" > valeur DPE: <input name="val" type="text" value=""> <input type="submit" value="valider"> </form> </body> </html>
En vous remerciant et en espérant de l'aide merci.

24/01/2011, 17h00
Invité
les chiffres vu qu'ils sont entre parenthese son reconu comme une chaine de carractere et pas comme des chiffres il ne peut donc pas y avoir de comparaison de chiffre

a mon avis la bonne syntaxe c'et celle ci
Code:

1 2 if (parseInt(f.val.value)>=51 && parseInt(f.val.value) <= 90)

Salut,

Il est préferable de s'assurer que la donnée saisie correspond bien à un nombre.

Ensuite, au lieu de faire

Code:

1
2
3
4
5
6
7
8
9
10
11
if(v<=50){
	// Inferieur ou égale à 50
	return false;
}
 
// Ici, v est forcemment >= 51
 
if (v>=51 && v<=90) {
	// De 51 a 90 inclus
	return false;
}

Il est préférable d'utiliser else if

Code:

1
2
3
4
5
6
7
if(v<=50){
	// Inferieur ou égale à 50
}
else if(v<=90){
	// De 51 a 90 inclus
}
return false;

Ensuite, document.write()... On oublie.

Dans l'exemple de code ci-dessous, la fonction appendImage() est appelée avec les paramètres suivants :

Code:

1
2
3
4
5
6
value	La valeur saisie
url	L'adresse de l'image
width	La largeur de l'image
height	La hauteur de l'image
alt	Le texte alternatif

Sont rôle est d'ajouter, dans l'arbre DOM, deux paragraphes dans l'élément <div> nommé "image". Le premier paragraphe contient la valeur saisie. Le deuxième contient l'image.

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
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	<title>Test</title>
	<meta name="description" content="Test" />
 
	<script type="text/javascript">//<![CDATA[
		function appendImage(value,url,width,height,alt){
			var elt=document.getElementById('image');
			if(url==''||!elt)return false;
 
			while(elt.hasChildNodes())elt.removeChild(elt.lastChild);
 
			var p=document.createElement('p');
			p.appendChild(document.createTextNode(value+' DPE'));
			elt.appendChild(p);
 
			var img=document.createElement('img');
			img.src=url;
			if(width>0 && height>0){
				img.width=width;
				img.height=height;
			}
			if(alt!=='')img.alt=alt;
 
			p=document.createElement('p');
			p.appendChild(img);
			elt.appendChild(p);
			p=null;
			img=null;
			elt=null;
			return false;
		}
 
		function validation(f){
			var msg='';
			if(/^\s*\d+\s*$/.test(f.val.value)){
				var v=parseInt(f.val.value,10);
				if(v<1)msg='Le nombre doit être supérieur à zéro';
			}
			else{
				msg='Veuillez saisir un nombre supérieur à zéro';
			}			
			if(msg!==''){
				alert(msg);
				return false;
			}
 
			if(v<=50){
				appendImage(v,'img-000.jpg',240,180,'Texte alternatif');	// de 1 à 50
			}
			else if(v<=90){
				appendImage(v,'img-001.jpg',240,180,'Texte alternatif');	// de 51 à 90
			}
			else if(v<=150){
				appendImage(v,'img-002.jpg',240,180,'Texte alternatif');	// de 91 à 150
			}
			else if(v<=230){
				appendImage(v,'img-003.jpg',240,180,'Texte alternatif');	// de 151 à 230
			}
			else if(v<=330){
				appendImage(v,'img-004.jpg',240,180,'Texte alternatif');	// de 231 à 330
			}
			else if(v<=450){
				appendImage(v,'img-005.jpg',240,180,'Texte alternatif');	// de 331 à 450
			}
			else{
				appendImage(v,'img-006.jpg',240,180,'Texte alternatif');	// v >= 450
			}
			return false;
		}
		//]]>
	</script>
</head>
<body>
	<form action="" method="post" onsubmit="return validation(this);">
		<p>	Valeur dpe :
			<input name="val" type="text" value="">
			<input type="submit" value="valider">
		</p>
	</form>
 
	<div id="image">
		<!-- Image placée ici par le scipt -->
	</div>
</body>
</html>

Ca ne correspont pas forcement à tes attentes. Mais si cela peut te faire abandonner l'utilisation de document.write()...

26/01/2011, 21h16
baka54

merci :)

je vais tester sa désoler de répondre que maintenant, et surtout merci de votre aide :$
26/01/2011, 21h29
baka54

cela est beaucoup mieux en effet

j’avoue que la c'est beaucoup mieux j'avais réussi après a avoir quelque chose mais la c'est largement mieux :$ maintenant c'est intégrer la valeur sur l'image, je pense utilisé objet style mais j'ai cru comprendre que sa posait des soucis avec ie :s

mais bon là, cela m'a beaucoup aidé je t'en remercie :), je vais pas abusé non plus je vais essayer de trouvé une solution a l'insertion de ma valeur sur l'image.

Merci en tout cas pour l'aide.