- ベストアンサー
リンクメニュー収納を２つ以上つくりたいのですが
- ホームページ作成中にjavascriptでのメニュー表示に問題が発生しています。一つのメニューは問題なく表示されるが、２つ以上のメニューを表示するとエラーが発生し表示されません。
- 【項目１】をクリックするとリンクメニューが表示されるjavascriptを作成中ですが、複数のメニューを表示するとエラーが出てしまいます。
- 複数のリンクメニューを作成するためのjavascriptでエラーが発生しており、正しく表示されません。回答お願いします。
- みんなの回答 （1）
- 専門家の回答
質問者が選んだベストアンサー
まず最初に、ここのカテゴリはJava専用で、JavaScript用のカテゴリも用意されていますので、JavaScriptについてはそちらで質問して下さい。 以下回答です。 <div id="a" style="display:none"> という部分がありますが、これのIDは'a'です。 IDは、1つのHTMLの中でユニークでなければならないので、他の部分にもid="a"と書いてしまうと、エラーとなってしまったりします。 単純にコピーして、同じIDを複数作ったりしていませんか？ このことを踏まえて自分好みにスクリプトを記述すると、次のようになります(動作確認済み)。(注：インデントは全角で行っています。) <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <HTML> <HEAD> <META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=UTF-8"> <META HTTP-EQUIV="Content-Script-Type" CONTENT="javascript"> <SCRIPT TYPE="text/javascript"> function showHide(id) { var elem = document.getElementById(id); if (elem.style.display == "none") { elem.style.display = ""; } else { elem.style.display = "none"; } } </SCRIPT> </HEAD> <BODY> <DIV> <A HREF="javascript:showHide('menu1')">めにゅー１</A> <DIV ID="menu1"> <DIV>１－１</DIV> <DIV>１－２</DIV> </DIV> </DIV> <DIV> <A HREF="javascript:showHide('menu2')">めにゅー２</A> <DIV ID="menu2"> <DIV>２－１</DIV> <DIV>２－２</DIV> </DIV> </DIV> </BODY> </HTML> あと、直接expand(a)としたら、引数のaは要素が渡されるということは始めて知りました。(普通はdocument.getElementById(IDの名前)によって要素を取得しますよね)勉強になりました。 何か技術的に分からない部分があれば、捕捉してもらえれば、お答えします。
お礼
迅速で的確なご回答ありがとうございます！ >まず最初に、ここのカテゴリはJava専用で、JavaScript用のカテゴリも用意されていますので、JavaScriptについてはそちらで質問して下さい。 大変失礼いたしました。javaとjavascriptは違うのですね…。次回から気をつけます。ご指摘ありがとうございます。 >単純にコピーして、同じIDを複数作ったりしていませんか？ 確認したら、ご指摘どおりでした。IDを変えてみたら上手く表示されました。記述していただいたスクリプトも大変参考になりました！活用させていただきます。動作確認までしていただき、ありがとうございます！こちらこそ勉強になりました。ご丁寧な回答で、とても助かりました。また質問をさせていただいた時はよろしくお願いいたします♪