besoin d'aide boucle if

**jérémy1664** · 09/01/2008, 14h56

Bonjour à tous

Je suis débutant en javascript (je n'y connais rien) et j'aurais besoin de quelques pistes pour modifier un programme qui calcule la résistance d'une résistance en fonction de ses couleurs.
Je m'explique j'aimerai n'avoir qu'une seule ligne de résultat en fonction de la valeur :

Si résultat < 999 ohms alors je l'affiche en ohms
Si 1000 < résultat < 999999 ohms alors je l'affiche en K ohms
S résultat > 1000000 ohms alors je l'affiche en M ohms

Je pense savoir qu'il s'agit d'une boucle if mais je ne comprend pas vraiment le langage

je poste ici le code source il est en html il suffit de faire un copier collé

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
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
 
<head>
<html>
	<title>Resist</title>
</head>
<body bgcolor="#ffffff" text="#000000" link="#FF0000" vlink="#FF0000" alink="#FF6666">
<noscript>Désolé, votre navigateur n'a pas le plugin javascript, ce programme ne peut pas s'éxécuter</noscript>
<div id=noner><input type="checkbox" name="non" checked></div>
<script language="Javascript"><!--
eval("document.all.noner.style.display='none'")//--></script>
<table align="center" border="0" cellpadding="0" cellspacing="0" width="50%" height="10%"
bgcolor="#ffffff">
    <tr>
        <td width="50%"><table border="0" cellpadding="0"
        cellspacing="0" width="100%" height="100%">
            <tr height="10%">
                <td width="75px"><hr size="2" width="100%" color="#000000">
                </td>
                <td width="75px"><table border="1" cellpadding="1"
                cellspacing="0" width="100%" height="100%" bgcolor="#000000">
                    <tr>
						<td width="16%" bgcolor="#ffffff">&nbsp;</td>
                        <td width="5%" id=Coul1>&nbsp;</td>
						<td width="8%" bgcolor="#ffffff">&nbsp;</td>
                        <td width="5%" id=Coul2>&nbsp;</td>
						<td width="8%" bgcolor="#ffffff">&nbsp;</td>
                        <td width="5%" id=Coul3>&nbsp;</td>
						<td width="16%" bgcolor="#ffffff">&nbsp;</td>
                        <td width="5%" id=Tol bgcolor="yellow">&nbsp;</td>
						<td width="16%" bgcolor="#ffffff">&nbsp;</td>
                    </tr>
                </table>
                </td>
                <td width="75px"><hr size="2" width="100%" color="#000000">
                </td>
            </tr>
        </table>
        <p>&nbsp;</p>
        </td>
    </tr>
 
</table>
</br></br>
<script>
<!--
function Couleur1() {
document.all.v1.value=document.all.C1.selectedIndex-1
if (document.all.C1.selectedIndex == 0) {document.all.v1.value='';document.all.Coul1.bgColor=''}
if (document.all.C1.selectedIndex == 1) {document.all.Coul1.bgColor='black'}
if (document.all.C1.selectedIndex == 2) {document.all.Coul1.bgColor='brown'}
if (document.all.C1.selectedIndex == 3) {document.all.Coul1.bgColor='red'}
if (document.all.C1.selectedIndex == 4) {document.all.Coul1.bgColor='orange'}
if (document.all.C1.selectedIndex == 5) {document.all.Coul1.bgColor='yellow'}
if (document.all.C1.selectedIndex == 6) {document.all.Coul1.bgColor='green'}
if (document.all.C1.selectedIndex == 7) {document.all.Coul1.bgColor='blue'}
if (document.all.C1.selectedIndex == 8) {document.all.Coul1.bgColor='darkviolet'}
if (document.all.C1.selectedIndex == 9) {document.all.Coul1.bgColor='silver'}
if (document.all.C1.selectedIndex == 10) {document.all.Coul1.bgColor='white'}}
function Couleur2() {
document.all.v2.value=document.all.C2.selectedIndex-1
if (document.all.C2.selectedIndex == 0) {document.all.v2.value='';document.all.Coul2.bgColor=''}
if (document.all.C2.selectedIndex == 1) {document.all.Coul2.bgColor='black'}
if (document.all.C2.selectedIndex == 2) {document.all.Coul2.bgColor='brown'}
if (document.all.C2.selectedIndex == 3) {document.all.Coul2.bgColor='red'}
if (document.all.C2.selectedIndex == 4) {document.all.Coul2.bgColor='orange'}
if (document.all.C2.selectedIndex == 5) {document.all.Coul2.bgColor='yellow'}
if (document.all.C2.selectedIndex == 6) {document.all.Coul2.bgColor='green'}
if (document.all.C2.selectedIndex == 7) {document.all.Coul2.bgColor='blue'}
if (document.all.C2.selectedIndex == 8) {document.all.Coul2.bgColor='darkviolet'}
if (document.all.C2.selectedIndex == 9) {document.all.Coul2.bgColor='silver'}
if (document.all.C2.selectedIndex == 10) {document.all.Coul2.bgColor='white'}}
function Couleur3() {
document.all.v3.value=document.all.C3.selectedIndex-1
if (document.all.C3.selectedIndex == 0) {document.all.v3.value='';document.all.Coul3.bgColor=''}
if (document.all.C3.selectedIndex == 1) {document.all.Coul3.bgColor='black'}
if (document.all.C3.selectedIndex == 2) {document.all.Coul3.bgColor='brown'}
if (document.all.C3.selectedIndex == 3) {document.all.Coul3.bgColor='red'}
if (document.all.C3.selectedIndex == 4) {document.all.Coul3.bgColor='orange'}
if (document.all.C3.selectedIndex == 5) {document.all.Coul3.bgColor='yellow'}
if (document.all.C3.selectedIndex == 6) {document.all.Coul3.bgColor='green'}
if (document.all.C3.selectedIndex == 7) {document.all.Coul3.bgColor='blue'}
if (document.all.C3.selectedIndex == 8) {document.all.Coul3.bgColor='darkviolet'}
if (document.all.C3.selectedIndex == 9) {document.all.Coul3.bgColor='silver'}
if (document.all.C3.selectedIndex == 10) {document.all.Coul3.bgColor='white'}}
function Tolere() {
if (document.all.Tole.selectedIndex == 0) {document.all.Tol.bgColor='yellow';document.all.v4.value='5'}
if (document.all.Tole.selectedIndex == 1) {document.all.Tol.bgColor='silver';document.all.v4.value='10'}
}
function num(text) {
num=text
if (text < 0) {num=""}
if (text > 9) {num=""}
}
function Calcval() {
var b1,b2,b3,min,max,T,b4
var n = 1
var expos = document.all.v3.value
if (expos == document.all.v3.existe) {expos=0}
for (var i = 1; i<= expos; i++) {n = eval(10*n)}
T=document.all.v4.value
if (T == document.all.v3.existe) {T=0}
b1=eval(document.all.v1.value)
if (b1 == document.all.v3.existe) {b1=0}
b4=document.all.v2.value
if (b4 == document.all.v3.existe) {b4=0}
b2=eval(b1+b4)
b3=eval(b2*n)
document.all.hom.value=b3
document.all.khom.value=eval(b3/1000)
document.all.mhom.value=eval(b3/1000/1000)
min=eval(b3-(T/100*b3))
max=eval(b3+(T/100*b3))
document.all.homin.value=min
document.all.khomin.value=eval(min/1000)
document.all.mhomin.value=eval(min/1000/1000)
document.all.homax.value=max
document.all.khomax.value=eval(max/1000)
document.all.mhomax.value=eval(max/1000/1000)
timer=setTimeout("Calcval()",700)
}
//-->
</script>
<table align="center">
<td align="center">
<p>Cliquez sur la flèche pour afficher la liste des couleurs<p>
</td>
</table>
</br><table border="0" cellspacing="0"align="center">
    <tr>
        <td width="25%"><p align="center">Bague 1</p>
        </td>
        <td width="25%"><p align="center">Bague 2</p>
        </td>
        <td width="25%"><p align="center">Bague 3</p>
        </td>
        <td width="25%"><p align="center">Tolérance</p>
        </td>
 
    </tr>
    <tr>
        <td width="25%"><select name="C1" OnChange="Couleur1();Calcval()">
	<option>~~~~~~~~~~
    <option>0 : Noir
    <option>1 : Marron
    <option>2 : Rouge
	<option>3 : Orange
	<option>4 : Jaune
	<option>5 : Vert
	<option>6 : Bleu
	<option>7 : Violet
	<option>8 : Gris
	<option>9 : Blanc
</select></td>
        <td width="25%"><select name="C2" OnChange="Couleur2();Calcval()">
	<option>~~~~~~~~~~
    <option value=0>0 : Noir
    <option value=1>1 : Marron
    <option value=2>2 : Rouge
	<option value=3>3 : Orange
	<option value=4>4 : Jaune
	<option value=5>5 : Vert
	<option value=6>6 : Bleu
	<option value=7>7 : Violet
	<option value=8>8 : Gris
	<option value=9>9 : Blanc
</select></td>
        <td width="25%"><select name="C3" OnChange="Couleur3();Calcval()">
	<option>~~~~~~~~~~
    <option value=0>0 : Noir
    <option value=1>1 : Marron
    <option value=2>2 : Rouge
	<option value=3>3 : Orange
	<option value=4>4 : Jaune
	<option value=5>5 : Vert
	<option value=6>6 : Bleu
	<option value=7>7 : Violet
	<option value=8>8 : Gris
	<option value=9>9 : Blanc
</select></td>
        <td width="25%"><select name="Tole" OnChange="Tolere();Calcval()">
 
    <option value=0>5% : Or
    <option value=1>10% : Argent
</select></td>
    </tr>
	<tr>
	<td align=center><div id=Calc1><sub><input name=v1 type=text size=1 readonly=1></sub></div></td>
	<td align=center><div id=Calc2><sub><input name=v2 type=text size=1 readonly=1></sub></div></td>
	<td align=left><div id=Calc3><sub>x10</sub><input name=v3 type=text size=1 readonly=1></div></td>
	<td align=center><div id=Calc4><input name=v4 type=text size=1 value=5 OnChange="Calcval()" OnKeyUp="Calcval()">%</div></td>
	</tr></div>
</table>
</br></br>
<div id=Valfi><table align="center" border="0" cellpadding="0" cellspacing="0"><tr border="1">
<td width="100"><font face="symbol"><center>»</center></font></td>
<td width="300">
	<table border="1" cellpadding="0" cellspacing="0" width="400">
    <tr>
        <td width="33%"><input type="text" size="11" name="hom" value="0" maxlength="11" readonly=1><font face="symbol">W</font></td>
        <td width="33%"><input type="text" size="10" name="khom" value="0" maxlength="10" readonly=1>K<font face="symbol">W</font></td>
        <td width="33%"><input type="text" size="10" name="mhom" value="0" maxlength="10" readonly=1>M<font face="symbol">W</font></td>
    </tr>
	</table>
</td></tr>
<tr>
<td width="100"><font><center>Soit de</center></font></td>
<td width="300">
	<table border="0" cellpadding="0" cellspacing="0" width="400">
	<tr>
        <td width="33%"><input type="text" size="11" name="homin" value="0" maxlength="11" readonly=1><font face="symbol">W</font></td>
        <td width="33%"><input type="text" size="10" name="khomin" value="0" maxlength="10" readonly=1>K<font face="symbol">W</font></td>
        <td width="33%"><input type="text" size="10" name="mhomin" value="0" maxlength="10" readonly=1>M<font face="symbol">W</font></td>
    </tr>
	</table></td>
</tr>
<tr>
<td width="100"><font><center>à</center></font></td>
<td width="300">
	<table border="0" cellpadding="0" cellspacing="0" width="300">
	<tr>
        <td width="33%"><input type="text" size="11" name="homax" value="0" maxlength="11" readonly=1><font face="symbol">W</font></td>
        <td width="33%"><input type="text" size="10" name="khomax" value="0" maxlength="10" readonly=1>K<font face="symbol">W</font></td>
        <td width="33%"><input type="text" size="10" name="mhomax" value="0" maxlength="10" readonly=1>M<font face="symbol">W</font></td>
    </tr>
	</table></td>
</tr>
</table></div>
<br>
<table align="center">
<tr>
       <td><input type="checkbox" name="showcal" checked OnClick="if (document.all.showcal.checked == document.all.non.checked) {document.all.Calc1.style.display='';document.all.Calc2.style.display='';document.all.Calc3.style.display='';document.all.Calc4.style.display=''} else {document.all.Calc1.style.display='none';document.all.Calc2.style.display='none';document.all.Calc3.style.display='none';document.all.Calc4.style.display='none'}">Afficher le calcul
<br><input type="checkbox" name="showres" checked OnClick="if (document.all.showres.checked == document.all.non.checked) {document.all.Valfi.style.display=''} else {document.all.Valfi.style.display='none'}">Afficher le résultat
</td>
</tr>
</table>
 
</form>
</body>
</html>

**fayred** · 09/01/2008, 15h38

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
 
<div id=Valfi><table align="center" border="0" cellpadding="0" cellspacing="0"><tr border="1">
<td width="100"><font face="symbol"><center>»</center></font></td>
<td width="300">
	<table border="1" cellpadding="0" cellspacing="0" width="400">
    <tr>
        <td width="33%"><input type="text" size="11" name="hom" value="0" maxlength="11" readonly=1><font face="symbol">W</font></td>
        <td width="33%"><input type="text" size="10" name="khom" value="0" maxlength="10" readonly=1>K<font face="symbol">W</font></td>
        <td width="33%"><input type="text" size="10" name="mhom" value="0" maxlength="10" readonly=1>M<font face="symbol">W</font></td>
    </tr>
	</table>
</td></tr>
<tr>
<td width="100"><font><center>Soit de</center></font></td>
<td width="300">
	<table border="0" cellpadding="0" cellspacing="0" width="400">
	<tr>
        <td width="33%"><input type="text" size="11" name="homin" value="0" maxlength="11" readonly=1><font face="symbol">W</font></td>
        <td width="33%"><input type="text" size="10" name="khomin" value="0" maxlength="10" readonly=1>K<font face="symbol">W</font></td>
        <td width="33%"><input type="text" size="10" name="mhomin" value="0" maxlength="10" readonly=1>M<font face="symbol">W</font></td>
    </tr>
	</table></td>
</tr>
<tr>
<td width="100"><font><center>à</center></font></td>
<td width="300">
	<table border="0" cellpadding="0" cellspacing="0" width="300">
	<tr>
        <td width="33%"><input type="text" size="11" name="homax" value="0" maxlength="11" readonly=1><font face="symbol">W</font></td>
        <td width="33%"><input type="text" size="10" name="khomax" value="0" maxlength="10" readonly=1>K<font face="symbol">W</font></td>
        <td width="33%"><input type="text" size="10" name="mhomax" value="0" maxlength="10" readonly=1>M<font face="symbol">W</font></td>
    </tr>
	</table></td>
</tr>
</table></div>
<br>
<table align="center">
<tr>
       <td><input type="checkbox" name="showcal" checked OnClick="if (document.all.showcal.checked == document.all.non.checked) {document.all.Calc1.style.display='';document.all.Calc2.style.display='';document.all.Calc3.style.display='';document.all.Calc4.style.display=''} else {document.all.Calc1.style.display='none';document.all.Calc2.style.display='none';document.all.Calc3.style.display='none';document.all.Calc4.style.display='none'}">Afficher le calcul
<br><input type="checkbox" name="showres" checked OnClick="if (document.all.showres.checked == document.all.non.checked) {document.all.Valfi.style.display=''} else {document.all.Valfi.style.display='none'}">Afficher le résultat
</td>
</tr>
</table>
 
</form>
</body>
</html>

Bonjour,

c'est à ce niveau qu'il faut que tu modifies le code je pense.
Pour t'aider un peu :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
 
<td width="33%"><input type="text" size="11" name="homax" value="0" maxlength="11" readonly=1><font face="symbol">W</font></td>
        <td width="33%"><input type="text" size="10" name="khomax" value="0" maxlength="10" readonly=1>K<font face="symbol">W</font></td>
        <td width="33%"><input type="text" size="10" name="mhomax" value="0" maxlength="10" readonly=1>M<font face="symbol">W</font></td>

ça c'est une ligne de résultats découpée en trois cases. C'est là qu'il faut choisir en fonction du resultat du calcul celui que tu affiches => en gros, pour chacune des trois lignes il faudra une structure if.

Ensuite pour cacher ou pas cacher vois du coté style display=block ou = none

Bon courage!

**jérémy1664** · 09/01/2008, 15h40

Merci je vais regarder mais je ne veux plus 3 lignes une suffira (si j'y arrive)

**jérémy1664** · 09/01/2008, 15h54

le plus logique me semblait etre cela mais ca ne marche pas est ce que j'ai un erreur de syntaxe ?

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
if (b3 < 999)
{
document.all.hom.value=b3
document.all.khom.value=eval(b3/1000).display=none
document.all.mhom.value=eval(b3/1000/1000).display=none
}
else (999 < b3 < 999999)
{
document.all.hom.value=b3.display=none
document.all.khom.value=eval(b3/1000)
document.all.mhom.value=eval(b3/1000/1000).display=none
}
else (b3 > 999999)
{
document.all.hom.value=b3.display=none
document.all.khom.value=eval(b3/1000).display=none
document.all.mhom.value=eval(b3/1000/1000)
}

**Auteur** · 09/01/2008, 16h33

bonjour jérémy1664,

Plusieurs remarques :
Code HTML

N'imbrique pas des tableaux dans des tableaux (présence de la balise table dans les td de table parent) : ça alourdit le code et c'est le meilleur moyen d'avoir un code HTML faux Pour fusionner des lignes ou des colonnes, tu as les propriétés rowspan ou colspan ;
Utilise les feuilles de styles (CSS) pour la présentation, les couleurs, les polices de caractères, etc.
Voir la discussion : http://www.developpez.net/forums/showthread.php?t=881

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
<input type="text" size="11" name="hom" value="0" maxlength="11" readonly=1>

Il y a une erreur dans ce code. Correction :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
<input type="text" size="11" name="hom" value="0" maxlength="11" readonly="readonly">

de même :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
<input type="checkbox" name="showcal" checked OnClick="....">Afficher le calcul

devient :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
<input type="checkbox" name="showcal" checked="checked" onclick="....">Afficher le calcul

Cela peut paraître redondant mais dans les balises HTML la syntaxe est la suivante :

attribut="valeur"

d'où readonly="readonly" et checked="checked" (entre autres)

Pour les événements (onload, onclick, onmouseover, onmouseout...) : écris les en minucules ;

Le code javscript qui suit un événement doit être court pour des questions de lisibilité. Dans ton cas créé une section (à placer dans le head):

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
 
<script type="text/javascript">
<!--
function MaFonction1(arg1, arg2)
{
.......
 
}
 
//-->
</script>

Puis dans le code HTML :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
<input type="checkbox" name="showcal" checked="checked" onclick="MaFonction('argument1','argument2')">Afficher le calcul

là tu en a mis des kilomètres, ton code JS est difficilement compréhensible

Pour ton code Javascript :

document.all n'est reconnu que par Internet Explorer
utilise plutôt l'attribut id au lieu de name pour désigner tes éléments. Attention : la valeur de id doit être unique ! Tu accèdes ensuite à chaque élément par la fonction :
Code javascript : Sélectionner tout - Visualiser dans une fenêtre à part
```
1
2
 
var monElement = document.getElementById("idElement");
```
la fonction eval() est sans intéret dans ton cas...

Dernier détail : prends soin d'indenter ton code

**tugdual** · 09/01/2008, 16h01

Bonjour jeremy,
voici une solution à ta question.
Je l'ai directement intégré à ton code.
Au passage j'ai enlevé tout tes document.all pour les remplacer par des document.getElementById
Bref, le résultat se voit dans la ligne ICI.

tugdual

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
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
 
<head>
<html>
	<title>Resist</title>
</head>
<body bgcolor="#ffffff" text="#000000" link="#FF0000" vlink="#FF0000" alink="#FF6666">
<noscript>Désolé, votre navigateur n'a pas le plugin javascript, ce programme ne peut pas s'éxécuter</noscript>
<div id=noner><input type="checkbox" name="non" checked></div>
<script language="Javascript"><!--
eval("document.getElementById('noner').style.display='none'")//--></script>
<table align="center" border="0" cellpadding="0" cellspacing="0" width="50%" height="10%"
bgcolor="#ffffff">
    <tr>
        <td width="50%"><table border="0" cellpadding="0"
        cellspacing="0" width="100%" height="100%">
            <tr height="10%">
                <td width="75px"><hr size="2" width="100%" color="#000000">
                </td>
                <td width="75px"><table border="1" cellpadding="1"
                cellspacing="0" width="100%" height="100%" bgcolor="#000000">
                    <tr>
						<td width="16%" bgcolor="#ffffff">&nbsp;</td>
                        <td width="5%" id=Coul1>&nbsp;</td>
						<td width="8%" bgcolor="#ffffff">&nbsp;</td>
                        <td width="5%" id=Coul2>&nbsp;</td>
						<td width="8%" bgcolor="#ffffff">&nbsp;</td>
                        <td width="5%" id=Coul3>&nbsp;</td>
						<td width="16%" bgcolor="#ffffff">&nbsp;</td>
                        <td width="5%" id=Tol bgcolor="yellow">&nbsp;</td>
						<td width="16%" bgcolor="#ffffff">&nbsp;</td>
                    </tr>
                </table>
                </td>
                <td width="75px"><hr size="2" width="100%" color="#000000">
                </td>
            </tr>
        </table>
        <p>&nbsp;</p>
        </td>
    </tr>
 
</table>
</br></br>
<script>
<!--
function Couleur1() {
document.getElementById('v1').value=document.getElementById('C1').selectedIndex-1
if (document.getElementById('C1').selectedIndex == 0) {document.getElementById('v1').value='';document.getElementById('Coul1').bgColor=''}
if (document.getElementById('C1').selectedIndex == 1) {document.getElementById('Coul1').bgColor='black'}
if (document.getElementById('C1').selectedIndex == 2) {document.getElementById('Coul1').bgColor='brown'}
if (document.getElementById('C1').selectedIndex == 3) {document.getElementById('Coul1').bgColor='red'}
if (document.getElementById('C1').selectedIndex == 4) {document.getElementById('Coul1').bgColor='orange'}
if (document.getElementById('C1').selectedIndex == 5) {document.getElementById('Coul1').bgColor='yellow'}
if (document.getElementById('C1').selectedIndex == 6) {document.getElementById('Coul1').bgColor='green'}
if (document.getElementById('C1').selectedIndex == 7) {document.getElementById('Coul1').bgColor='blue'}
if (document.getElementById('C1').selectedIndex == 8) {document.getElementById('Coul1').bgColor='darkviolet'}
if (document.getElementById('C1').selectedIndex == 9) {document.getElementById('Coul1').bgColor='silver'}
if (document.getElementById('C1').selectedIndex == 10) {document.getElementById('Coul1').bgColor='white'}}
function Couleur2() {
document.getElementById('v2').value=document.getElementById('C2').selectedIndex-1
if (document.getElementById('C2').selectedIndex == 0) {document.getElementById('v2').value='';document.getElementById('Coul2').bgColor=''}
if (document.getElementById('C2').selectedIndex == 1) {document.getElementById('Coul2').bgColor='black'}
if (document.getElementById('C2').selectedIndex == 2) {document.getElementById('Coul2').bgColor='brown'}
if (document.getElementById('C2').selectedIndex == 3) {document.getElementById('Coul2').bgColor='red'}
if (document.getElementById('C2').selectedIndex == 4) {document.getElementById('Coul2').bgColor='orange'}
if (document.getElementById('C2').selectedIndex == 5) {document.getElementById('Coul2').bgColor='yellow'}
if (document.getElementById('C2').selectedIndex == 6) {document.getElementById('Coul2').bgColor='green'}
if (document.getElementById('C2').selectedIndex == 7) {document.getElementById('Coul2').bgColor='blue'}
if (document.getElementById('C2').selectedIndex == 8) {document.getElementById('Coul2').bgColor='darkviolet'}
if (document.getElementById('C2').selectedIndex == 9) {document.getElementById('Coul2').bgColor='silver'}
if (document.getElementById('C2').selectedIndex == 10) {document.getElementById('Coul2').bgColor='white'}}
function Couleur3() {
document.getElementById('v3').value=document.getElementById('C3').selectedIndex-1
if (document.getElementById('C3').selectedIndex == 0) {document.getElementById('v3').value='';document.getElementById('Coul3').bgColor=''}
if (document.getElementById('C3').selectedIndex == 1) {document.getElementById('Coul3').bgColor='black'}
if (document.getElementById('C3').selectedIndex == 2) {document.getElementById('Coul3').bgColor='brown'}
if (document.getElementById('C3').selectedIndex == 3) {document.getElementById('Coul3').bgColor='red'}
if (document.getElementById('C3').selectedIndex == 4) {document.getElementById('Coul3').bgColor='orange'}
if (document.getElementById('C3').selectedIndex == 5) {document.getElementById('Coul3').bgColor='yellow'}
if (document.getElementById('C3').selectedIndex == 6) {document.getElementById('Coul3').bgColor='green'}
if (document.getElementById('C3').selectedIndex == 7) {document.getElementById('Coul3').bgColor='blue'}
if (document.getElementById('C3').selectedIndex == 8) {document.getElementById('Coul3').bgColor='darkviolet'}
if (document.getElementById('C3').selectedIndex == 9) {document.getElementById('Coul3').bgColor='silver'}
if (document.getElementById('C3').selectedIndex == 10) {document.getElementById('Coul3').bgColor='white'}}
function Tolere() {
if (document.getElementById('Tole').selectedIndex == 0) {document.getElementById('Tol').bgColor='yellow';document.getElementById('v4').value='5'}
if (document.getElementById('Tole').selectedIndex == 1) {document.getElementById('Tol').bgColor='silver';document.getElementById('v4').value='10'}
}
function num(text) {
num=text
if (text < 0) {num=""}
if (text > 9) {num=""}
}
function Calcval() {
var b1,b2,b3,min,max,T,b4
var n = 1
var expos = document.getElementById('v3').value
if (expos == document.getElementById('v3').existe) {expos=0}
for (var i = 1; i<= expos; i++) {n = eval(10*n)}
T=document.getElementById('v4').value
if (T == document.getElementById('v3').existe) {T=0}
b1=eval(document.getElementById('v1').value)
if (b1 == document.getElementById('v3').existe) {b1=0}
b4=document.getElementById('v2').value
if (b4 == document.getElementById('v3').existe) {b4=0}
b2=eval(b1+b4)
b3=eval(b2*n)
document.getElementById('hom').value=b3
document.getElementById('khom').value=eval(b3/1000)
document.getElementById('mhom').value=eval(b3/1000/1000)
min=eval(b3-(T/100*b3))
max=eval(b3+(T/100*b3))
document.getElementById('homin').value=min
document.getElementById('khomin').value=eval(min/1000)
document.getElementById('mhomin').value=eval(min/1000/1000)
document.getElementById('homax').value=max
document.getElementById('khomax').value=eval(max/1000)
document.getElementById('mhomax').value=eval(max/1000/1000)
if (b3<1000)
document.getElementById('mavaleur').innerHTML=b3
else if (b3>=1000 && b3<=999999)
document.getElementById('mavaleur').innerHTML=b3/1000+"K"
else
document.getElementById('mavaleur').innerHTML=b3/1000/1000+"M"
if (min<1000)
document.getElementById('mavaleurmin').innerHTML=min
else if (min>=1000 && min<=999999)
document.getElementById('mavaleurmin').innerHTML=min/1000+"K"
else
document.getElementById('mavaleurmin').innerHTML=min/1000/1000+"M"
if (max<1000)
document.getElementById('mavaleurmax').innerHTML=max
else if (max>=1000 && max<=999999)
document.getElementById('mavaleurmax').innerHTML=max/1000+"K"
else
document.getElementById('mavaleurmax').innerHTML=max/1000/1000+"M"
timer=setTimeout("Calcval()",700)
}
//-->
</script>
<table align="center">
<td align="center">
<p>Cliquez sur la flèche pour afficher la liste des couleurs<p>
</td>
</table>
</br><table border="0" cellspacing="0"align="center">
    <tr>
        <td width="25%"><p align="center">Bague 1</p>
        </td>
        <td width="25%"><p align="center">Bague 2</p>
        </td>
        <td width="25%"><p align="center">Bague 3</p>
        </td>
        <td width="25%"><p align="center">Tolérance</p>
        </td>
 
    </tr>
    <tr>
        <td width="25%"><select id="C1" OnChange="Couleur1();Calcval()">
	<option>~~~~~~~~~~
    <option>0 : Noir
    <option>1 : Marron
    <option>2 : Rouge
	<option>3 : Orange
	<option>4 : Jaune
	<option>5 : Vert
	<option>6 : Bleu
	<option>7 : Violet
	<option>8 : Gris
	<option>9 : Blanc
</select></td>
        <td width="25%"><select id="C2" OnChange="Couleur2();Calcval()">
	<option>~~~~~~~~~~
    <option value=0>0 : Noir
    <option value=1>1 : Marron
    <option value=2>2 : Rouge
	<option value=3>3 : Orange
	<option value=4>4 : Jaune
	<option value=5>5 : Vert
	<option value=6>6 : Bleu
	<option value=7>7 : Violet
	<option value=8>8 : Gris
	<option value=9>9 : Blanc
</select></td>
        <td width="25%"><select id="C3" OnChange="Couleur3();Calcval()">
	<option>~~~~~~~~~~
    <option value=0>0 : Noir
    <option value=1>1 : Marron
    <option value=2>2 : Rouge
	<option value=3>3 : Orange
	<option value=4>4 : Jaune
	<option value=5>5 : Vert
	<option value=6>6 : Bleu
	<option value=7>7 : Violet
	<option value=8>8 : Gris
	<option value=9>9 : Blanc
</select></td>
        <td width="25%"><select id="Tole" OnChange="Tolere();Calcval()">
 
    <option value=0>5% : Or
    <option value=1>10% : Argent
</select></td>
    </tr>
	<tr>
	<td align=center><div id=Calc1><sub><input id=v1 type=text size=1 readonly=1></sub></div></td>
	<td align=center><div id=Calc2><sub><input id=v2 type=text size=1 readonly=1></sub></div></td>
	<td align=left><div id=Calc3><sub>x10</sub><input id=v3 type=text size=1 readonly=1></div></td>
	<td align=center><div id=Calc4><input id=v4 type=text size=1 value=5 OnChange="Calcval()" OnKeyUp="Calcval()">%</div></td>
	</tr></div>
</table>
</br></br>
<div id=Valfi><table align="center" border="0" cellpadding="0" cellspacing="0"><tr border="1">
<td width="100"><font face="symbol"><center>»</center></font></td>
<td width="300">
	<table border="1" cellpadding="0" cellspacing="0" width="400">
    <tr>
        <td width="33%"><input type="text" size="11" id="hom" value="0" maxlength="11" readonly=1><font face="symbol">W</font></td>
        <td width="33%"><input type="text" size="10" id="khom" value="0" maxlength="10" readonly=1>K<font face="symbol">W</font></td>
        <td width="33%"><input type="text" size="10" id="mhom" value="0" maxlength="10" readonly=1>M<font face="symbol">W</font></td>
    </tr>
	</table>
</td></tr>
<tr>
<td width="100"><font><center>Soit de</center></font></td>
<td width="300">
	<table border="0" cellpadding="0" cellspacing="0" width="400">
	<tr>
        <td width="33%"><input type="text" size="11" id="homin" value="0" maxlength="11" readonly=1><font face="symbol">W</font></td>
        <td width="33%"><input type="text" size="10" id="khomin" value="0" maxlength="10" readonly=1>K<font face="symbol">W</font></td>
        <td width="33%"><input type="text" size="10" id="mhomin" value="0" maxlength="10" readonly=1>M<font face="symbol">W</font></td>
    </tr>
	</table></td>
</tr>
<tr>
<td width="100"><font><center>à</center></font></td>
<td width="300">
	<table border="0" cellpadding="0" cellspacing="0" width="300">
	<tr>
        <td width="33%"><input type="text" size="11" id="homax" value="0" maxlength="11" readonly=1><font face="symbol">W</font></td>
        <td width="33%"><input type="text" size="10" id="khomax" value="0" maxlength="10" readonly=1>K<font face="symbol">W</font></td>
        <td width="33%"><input type="text" size="10" id="mhomax" value="0" maxlength="10" readonly=1>M<font face="symbol">W</font></td>
    </tr>
	</table></td>
</tr>
<tr>
<td width="100"><font><center>ICI</center></font></td>
<td width="300">
	<table border="0" cellpadding="0" cellspacing="0" width="400">
	<tr>
		<td width="33%"><span id="mavaleur"></span><font face="symbol">W</font></td>
        <td width="33%"><span id="mavaleurmin"></span><font face="symbol">W</font></td>
        <td width="33%"><span id="mavaleurmax"></span><font face="symbol">W</font></td>
    </tr>
	</table></td>
</tr>
</table></div>
<br>
<table align="center">
<tr>
       <td><input type="checkbox" name="showcal" checked OnClick="if (document.getElementById('showcal').checked == document.getElementById('non').checked) {document.getElementById('Calc1').style.display='';document.getElementById('Calc2').style.display='';document.getElementById('Calc3').style.display='';document.getElementById('Calc4').style.display=''} else {document.getElementById('Calc1').style.display='none';document.getElementById('Calc2').style.display='none';document.getElementById('Calc3').style.display='none';document.getElementById('Calc4').style.display='none'}">Afficher le calcul
<br><input type="checkbox" name="showres" checked OnClick="if (document.getElementById('showres').checked == document.getElementById('non').checked) {document.getElementById('Valfi').style.display=''} else {document.getElementById('Valfi').style.display='none'}">Afficher le résultat
</td>
</tr>
</table>
 
</form>
</body>
</html>

**jérémy1664** · 09/01/2008, 16h39

merci beacoup mais pourquoi a tu remplacer all par getElementById

**jérémy1664** · 09/01/2008, 16h41

exuzez moi j'avais pas encore lu la dernière réponse

**jérémy1664** · 10/01/2008, 14h42

Merci a tous le résultat est parfais mais j'aimerai juste pouvoir remettre les champs à 0 quand j'actualise la page et je ne sais pas comment m'y prendre
je voudrai aussi faire un bouton de remise à zero

**SpaceFrog** · 10/01/2008, 15h21

c'est le genre de chose que l'on ferait plutot avec un switch ...
mais bon ...

sinon pour la remie à zero :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

document.getElementById('idInput').value=""

et sur un bouton raz:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
<input type="button" onclick="document.getElementById('idInput').value=''" value="RAZ" />

si tu avais eu un form tu aurais mise des valeurs par defaut et fasi juste un reset sur le form ...

besoin d'aide boucle if

JavaScript

Vue hybride

Discussions similaires

Partager

Partager