問題があり、解決策が見つかりません。jqueryでアコーディオンメニューを作成していて、メニューの2番目のレベルを一度に1つずつ開きたいと思っています。
そして、ページがリロードされたときにこれを開いたままにする方法のヘルプをWebサイトで使用したいと思います。
読めないのでごめんなさい。
誰もが助けてくれることを願っています。
私はこの種のものの初心者です。
$(document).ready(function(){
menuHead = $('.slide-list li a').click(function() {
$('.selected').removeClass('selected');
$(this).addClass('selected');
$(this).next().toggle("slow");
});
});
* {
margin: 0;
padding: 0;
}
html, body {
height: 100%;
width: 100%;
}
a:link {
text-decoration:none;
color: #000;
}
a:active {
text-decoration:none;
color: #000;
}
a:visitied {
text-decoration:none;
color: #000;
}
a:hover {
text-decoration:none;
color: #CCC;
}
#menu-wrapper {
}
#menu-wrapper ul.slide-list li {
list-style-type: none;
}
#menu-wrapper ul.slide-list li a.selected {
color: #F00;
}
#menu-wrapper ul.slide-list li ul {
display: none;
}
#menu-wrapper ul.slide-list li ul li ul {
display: none;
}
<script class="jsbin" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<div id="menu-wrapper">
<ul class="slide-list">
<li>
<a href="javascript:void()">menu item 1</a>
<ul>
<li>
<a href="javascript:void()">submenu item 1 level 2</a>
<ul>
<li>
<a href="javascript:void()">submenu item level 3</a>
</li>
</ul>
</li>
<li>
<a href="javascript:void()">submenu item 2 level 2</a>
<ul>
<li>
<a href="javascript:void()">submenu item level 3</a>
</li>
</ul>
</li>
</ul>
</li>
<li>
<a href="javascript:void()">menu item 2</a>
<ul>
<li>
<a href="javascript:void()">submenu item 1 level 2</a>
</li>
</ul>
</li>
<li>
<a href="javascript:void()">menu item 3</a>
</li>
</ul>
</div>