afficher/masquer fonctionne pas sous firefox

Bonjour,
Je suis nouveau sur la liste alors ma question vous paraîtra peut être évidente. :oops:
J'ai fais un script pour masquer/afficher des div avec des boutons radio, ça fonctionne sous ie mais rien sous firefox (ni chrome) :cry:
merci de votre aide

voici le code

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
 
<HTML>
<HEAD>
<!-- Menu  html/js/ex/5.bk Hiding Table Columns -->
<link rel="stylesheet" type="text/css" href="../../default.css">
<TITLE>JavaScript - Hiding Table Columns</TITLE>
<style type="text/css">
#progmenu { position:absolute; top:0; left:0; visibility:hidden; }
#miscmenu { position:absolute; top:0; left:0; visibility:hidden; }   
.TitleMenu { width:110; }
.TitleMenuItem { }
</style>
<script language="javascript">
var showMode = 'block';
function toggleVis(radio){
  name=radio;
radio   = document.forms['tcol'].elements[radio];
for(j = 0; j < radio.length; j++){
    if (radio[j].checked){
      max=j;
    }
  }
    for (k=0;k<4;k++){
      cells = document.getElementsByName('div'+radio[k].value);
   if (max!=4){
    if (k==max)
        mode  = showMode;
      else
        mode  = 'none';
      }else{
        mode  = showMode;
      }
   for(j = 0; j < cells.length; j++)
        cells[j].style.display=mode;
  }
}
</script>
</HEAD>
<BODY MARGINWIDTH=0 MARGINHEIGHT=0 onload="init()">
<form name="tcol" onsubmit="return false">
<table border=0 bgcolor="#ffeecc">
<tr><td>
Show columns
<input type=radio name="col1" value="col1" onclick="toggleVis(this.name)"> 1
<input type=radio name="col1" value="col2" onclick="toggleVis(this.name)"> 2
<input type=radio name="col1" value="col3" onclick="toggleVis(this.name)"> 3
<input type=radio name="col1" value="col4" onclick="toggleVis(this.name)"> 4
<input type=radio name="col1" value="all" onclick="toggleVis(this.name)" checked> all
</td></tr>
</table>
</form>
<div id="divcol1" style="border: 2px solid rgb(209, 29, 67); padding: 5px; margin-top: 5px;">
      <p>#1 : Ici mon texte</p>
</div>
<div id="divcol2" style="border: 2px solid rgb(209, 29, 67); padding: 5px;">
      <p>#2 : Ici mon texte</p>
</div>
<div id="divcol3" style="border: 2px solid rgb(209, 29, 67); padding: 5px;">
      <p>#3 : Ici mon texte</p>
</div>
<div id="divcol4" style="border: 2px solid rgb(209, 29, 67); padding: 5px;">
      <p>#4 : Ici mon texte</p>
</div>
</BODY>
</HTML>
</head>

Bonsoir,

IE confond l'attibut name et id, donc c'est normal que ça marche avec lui. Tu appelles les éléments avec getElementsByName or que tu dois appeler chacun d'eux avec getElementById.

[hs]Te dire bienvenue avec ta date d'inscription :oops:[/hs]

A+.

Bonsoir

Citation:

Envoyé par andry.aime

IE confond l'attibut name et id, donc c'est normal que ça marche avec lui. Tu appelles les éléments avec getElementsByName or que tu dois appeler chacun d'eux avec getElementById.

Logique ... J'ai fait le changement et plus rien ne fonctionne, quelque soit le navigateur :cry:

Citation:

Envoyé par andry.aime

[hs]Te dire bienvenue avec ta date d'inscription :oops:[/hs]

Je suis déjoué :ccool: ici je parlais de mon premier post sur le forum javascript

Merci de votre aide

Bonjour,

Code:

1
2
3
cells=new Array();
 for (k=0;k<4;k++){
cells[k] = document.getElementById('div'+radio[k].value);