特定のclassを表示、非表示にする
javascriptで特定のclassを表示、非表示にする方法を検討中なのですが、
a,b,cと三つのボタンが有り、abcというclassがあります。
aをクリックするとb,cが非表示になり、aが表示される
bをクリックするとa,cが非表示になり、bが表示される
cをクリックするとa,bが非表示になり、cが表示される
と言う動作をさせたいのですが、上手くいきません。
どなたかご教授ください。
お願いいたします。
<script type="text/javascript">
<!--
function change(site){
if(!document.getElementsByTagName){return;}
var e = new Array('a','b','c');
var objs = document.getElementsByTagName('*');
for(i=0;i<e.length;i++){
if(e[i] != site){
for(y=0;y<objs.length;y++){
if(objs[y].className == e[i]){
objs[y].style.display = 'none';
}else{
objs[y].style.display = '';
}
}
}
}
}
// -->
</script>
<table cellspacing="10">
<tr>
<th>テスト</th>
<td>
<input type="text" name="" id="" class="a" value="" />
<input type="text" name="" id="" class="b" value="" />
</td>
</tr>
<tr>
<th>test</th>
<td>
<input type="text" name="" id="" class="c" value="" />
</td>
</tr>
</table>
<a href="javascript:change('a')">a</a>
<a href="javascript:change('b')">b</a>
<a href="javascript:change('c')">c</a>
