質問: お世話になります。 いま作っているサイトに、縦のアコーディオンメニューをつけようとしています。 jQueryを利用して、 ``` メニュー1 サブメニュー11 サブメニュー12 サブメニュー13 メニュー2 サブメニュー21 サブメニュー22 サブメニュー23 メニュー3 サブメニュー31 サブメニュー32 サブメニュー33 ``` ``` ``` ``` dl#acMenu{ width:320px; height:auto; overflow:hidden; } dl#acMenu dt{ display:block; } dl#acMenu dd{ clear:both; display:none; } ``` というコードを書いたところ、クリックしたら開閉するメニューを作ることはできたのですが、「クリック時に『既に開いているメニュー』を閉じる」動作が実装できず困っております。dt直下のddが1つずつしかない場合には、 $(this).next("dd").siblings("dd").slideUp(); を加えれば希望の動作となりますが、ddが複数ある場合はお手上げです。 どなたか良い案もしくは「ここを読め」的資料をご紹介いただけると嬉しいです。
回答: class指定して、すべて閉じてから動作させればシンプルになります。 やりたいことと違ったらごめんなさい。 HTML ``` メニュー1 サブメニュー11 サブメニュー12 サブメニュー13 メニュー2 サブメニュー21 サブメニュー22 サブメニュー23 メニュー3 サブメニュー31 サブメニュー32 サブメニュー33 ``` JQuery ``` $(function() { $("#acMenu dt").on("click", function() { $('.close').hide(); $(this).nextUntil("dt","dd").slideToggle("fast"); }); }); ```