▲▲JavaScriptのツリーメニューについて▲▲

質問

現在このような記述でツリーメニューを作っています

trList = ["treeMenu1","treeMenu2","treeMenu3","treeMenu4","treeMenu5","treeMenu6","treeMenu7","treeMenu8"];
function exMenu(tName)
{
for (i=0; i<trList.length; i++) eval(trList[i]).style.display = "none";
tMenu = eval(tName).style;
if (tMenu.display == 'none') tMenu.display = "block"; else tMenu.display = "none";
}

本文は
<img src="sozai/menu1.gif" alt="矢印" width="13" height="13">&nbsp;<a href="javascript:exMenu('treeMenu1')">教会のご案内</a>
<div id="treeMenu1" style="display:none" class="font_menu2">
<img src="sozai/menu2.gif" alt="矢印" width="9" height="9">&nbsp;<a href="kyoukai_1_1.html" target="main">牧師・スタッフの紹介</a><br>
<img src="sozai/menu2.gif" alt="矢印" width="9" height="9">&nbsp;<a href="kyoukai_2_1.html" target="main">教会施設の紹介</a><br>
<img src="sozai/menu2.gif" alt="矢印" width="9" height="9">&nbsp;<a href="kyoukai_3_1.html" target="main">交通のご案内</a><br>
<img src="sozai/menu2.gif" alt="矢印" width="9" height="9">&nbsp;<a href="kyoukai_4_1.html" target="main">教会QandA</a>
</div>
こんな感じです☆多少こちらで決めたタグなども入っていますが…。
テーブルを使って記述しています。

上記を見まして、「教会のご案内」をクリックするとメニューが出てきます。もう一度「教会のご案内」をクリックすると表示されたメニューが表示されていない状態に戻すように表示をしたいんです。

説明下手ですが、おわかりになる方タグなどを教えてくださいｖ(。・・。)

回答No.1

yambejp · ベストアンサー

みたかんじforでまわして全てnoneにしてから、チェックをいれているので
だめみたいですね。
例えばこんな感じで、forの前に変数に取っておけばよろしいかと。
（ちなみにevalでオブジェクトをつかもうとするのはさすがに
やめたほうがいいですよ）

<script>
trList = Array("treeMenu1","treeMenu2","treeMenu3","treeMenu4","treeMenu5","treeMenu6","treeMenu7","treeMenu8");
function exMenu(tName){
tMenu = document.getElementById(tName).style;
d = tMenu.display;
for (i=0; i<trList.length; i++){
if(document.getElementById(trList[i])) document.getElementById(trList[i]).style.display = "none";
}
if (d == 'none') tMenu.display = "block";
else tMenu.display = "none";
}
</script>

<img src="sozai/menu1.gif" alt="矢印" width="13" height="13">&nbsp;<a href="javascript:exMenu('treeMenu1')">教会のご案内</a>
<div id="treeMenu1" style="display:none" class="font_menu2">
<img src="sozai/menu2.gif" alt="矢印" width="9" height="9">&nbsp;<a href="kyoukai_1_1.html" target="main">牧師・スタッフの紹介</a><br>
<img src="sozai/menu2.gif" alt="矢印" width="9" height="9">&nbsp;<a href="kyoukai_2_1.html" target="main">教会施設の紹介</a><br>
<img src="sozai/menu2.gif" alt="矢印" width="9" height="9">&nbsp;<a href="kyoukai_3_1.html" target="main">交通のご案内</a><br>
<img src="sozai/menu2.gif" alt="矢印" width="9" height="9">&nbsp;<a href="kyoukai_4_1.html" target="main">教会QandA</a>
</div>

お礼

お返事が遅れて本当にすいません。

感謝しています＾＾ァりがとうございます(´―`)

回答No.2

noname#23734

trList = ["treeMenu1","treeMenu2","treeMenu3","treeMenu4","treeMenu5","treeMenu6","treeMenu7","treeMenu8"];
window.onload=function(){
for (i=0; i<trList.length; i++) eval(trList[i]).style.display="none";
}
function exMenu(tName){
aaa=evel(tName)
for (i=0; i<trList.length; i++){
tMenu = eval(trList[i]);
if (aaa==tMenu&&aaa.style.display=='none') tMenu.style.display="block";else tMenu.style.display="none";
}
}

お礼

お返事が遅れて本当にすいません。

感謝しています＾＾ァりがとうございます(´―`)

補足

↑この入力の場合、本文の入力はこのままで大丈夫でしょうか？