besoin d'aide boucle if

Version imprimable

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:

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>

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
 
<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:

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!

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

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

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

Code:

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)
}

une solution

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:

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>

09/01/2008, 16h33
Auteur
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:
  
  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:
  
  1 2 <input type="text" size="11" name="hom" value="0" maxlength="11" readonly="readonly">
  de même :
  Code:
  
  1 2 <input type="checkbox" name="showcal" checked OnClick="....">Afficher le calcul
  devient :
  Code:
  
  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:
  
  1 2 3 4 5 6 7 8 9 10 11 <script type="text/javascript">  </script>
  Puis dans le code HTML :
  Code:
  
  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 :aie:
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:
  
  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 ;)
09/01/2008, 16h39
jérémy1664

merci beacoup mais pourquoi a tu remplacer all par getElementById
09/01/2008, 16h41
jérémy1664

exuzez moi j'avais pas encore lu la dernière réponse
:lol::lol::lol:
10/01/2008, 14h42
jérémy1664

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
10/01/2008, 15h21
SpaceFrog
c'est le genre de chose que l'on ferait plutot avec un switch ...
mais bon ...

sinon pour la remie à zero :

Code:

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

et sur un bouton raz:
Code:

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 ...
10/01/2008, 15h31
jérémy1664

En fait je me rend compte que ce n'est pas ce que je voulais
Je veux que quand j'actualise ma page les champs de texte se mettent à la valeur -1

champs de texte ??? ou select ???
Code:

1 2 3 4 5 function resetSelects(){ var tabSelects=document.getElementsByTagName('select'); for (i=0;i<tabSelects.length;i++){tabSelects[i].selectedIndex=-1; } }
et

Code:

<input type='button' onclick="resetSelects();" value="RAZ" />

10/01/2008, 15h42
jérémy1664

Comprend pas
En fait j'ai pas besoin du code pour que ca marche sur ie7 mais j'arrive pas à faire la meme chose sur mozilla
10/01/2008, 15h51
jérémy1664

En fait il faudrai je pense que je puisse mettre l'option du select à la valeur -1
10/01/2008, 15h51
SpaceFrog

mozilla conserve les selections...
lance la focntion de RAZ sur le onload ...
10/01/2008, 16h01
jérémy1664

onload=resetSelects(); value="" ???
10/01/2008, 16h03
SpaceFrog

non :

Code:

<body onload="resetSelects()" >
10/01/2008, 16h40
jérémy1664

ça ne marche pas sur ff :evilred:
10/01/2008, 16h43
jérémy1664

ça marche quand j'ouvre la page mais pas quand j'actualise
11/01/2008, 08h46
SpaceFrog

ton onload ne se declenche pas sur une actualisation de page ????? 8O8O8O
11/01/2008, 08h58
jérémy1664

En fait tu peux le voir ici

http://gs-computer.eu/index.php?page...stance&lang=fr

J'aimerai que mes selects redeviennent comme à l'ouverture de la page quand j'actualise .
11/01/2008, 09h02
jérémy1664

ça marche sur IE mais pas sur FF
11/01/2008, 09h29
SpaceFrog
oulà mais c'est un vaste capharnaum ton truc là !!!
Faut revoire les bases de la structure d'une page html !!!

quand je dis mettre le onload dans la balise body :
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 <html> <head> <meta>....</meta> <script type="text/javascript"> fucntion blabla(){ ...} </script> </head> <body onload="blabla();"> ...le corps de la page </body> </html>
et essaye de perdre cette très mauvais habitude de vouloir echapper les " pas besoin de / partout !

C'est comme cela qu'il est
Code:

1 2 3 4 5 </script> </head> <body onload="resetSelects()"> <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>
Je vais délester le code html petit à petit mais je n'ai pas encore vraiment choisit la configuration de la mise en page :oops:

11/01/2008, 09h36
jérémy1664

Je dois peut etre mettre le <noscript> entre les balises <head>
11/01/2008, 09h36
SpaceFrog
On ne doit pas parler de la même page ...
dasn le source moi j'ai:
Code:

1 2 3 4 <script type="text/javascript"> <body onload="document.title=\"\";"> </script>
et ça c'est du grand vide intersidéral ...
11/01/2008, 11h02
jérémy1664

En fait il y a un index qui appelle trois pages php pour former celle qu'on voit donc ça fait que je me retrouve avec quatre body mais meme si j'ajoute la fonction sur le body de l'index elle ne marche pas

???
11/01/2008, 11h07
SpaceFrog

il ne doit y avoir qu'un seul body sur la page
les pages includées ne doivent pas comporter de balises body si elles sont includées dans le body
11/01/2008, 11h52
jérémy1664

N'y a t-il pas un moyen de contourner ce problème juste pour l'actualisation de cette page parce que sinon c'est tout le site qu'il faut que je recommence et j'ai pas vraiment le temps, il est quand même assez conséquent et je suis entrain d'en réaliser un autre en joomla (moins de problème d'intégration html)
Sinon merci beaucoup pour ton aide mais j'aimerai quand même finir cette petite appli.
:roll:
11/01/2008, 11h58
SpaceFrog
tu peux toujours lancer l'instruction en dernière ligne de ta page ...
il suffit de mettre juste avant la balise de fermeture du body :
Code:

1 2 3 4 <script type='text/javascript'> resetSelects(); </script>
ça ne sera qu'un pauvre pansement

Une page avec 4 body, les navigateurs vont raler !
C'est une hérésie !!!