codage avec js

**baka54** · 24/01/2011, 16h19

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 :

S�lectionner tout - Visualiser dans une fen�tre � part

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.

Invit� · 24/01/2011, 17h00

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 :

S�lectionner tout - Visualiser dans une fen�tre � part

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

**Eric2a** · 24/01/2011, 20h19

Salut,

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

Ensuite, au lieu de faire

Code :

S�lectionner tout - Visualiser dans une fen�tre � part

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 :

S�lectionner tout - Visualiser dans une fen�tre � part

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 :

S�lectionner tout - Visualiser dans une fen�tre � part

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 :

S�lectionner tout - Visualiser dans une fen�tre � part

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()...

**baka54** · 26/01/2011, 21h16

je vais tester sa d�soler de r�pondre que maintenant, et surtout merci de votre aide :$

**baka54** · 26/01/2011, 21h29

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.

codage avec js

JavaScript

Vue hybride

Discussions similaires

Partager

Partager