0
私がサイドバーのメニューナビゲーションに取り組んでいます。このナビゲーションは、ユーザーがメニューをクリックすると展開して折り畳まれます。さらに、ページが読み込まれたときにサブメニューのリンクがアクティブな場合、メニューを拡張したままにしておきたい。Jqueryの展開と折りたたみメニューが機能しない
これは私が今作業しているコードサンプルです。誰かが私のコードで問題を確認するのを助けてくれますか？
jQuery(document).ready(function(e) {
{
var m = e("ul.menu li.sidebar ul.sub-menu");
e("li")
}
e("ul.menu > li.sidebar > a").click(function(e) {
e.preventDefault()
}),
e(document).mouseup(function(i) {
var n = e("li.sidebar");
n.is(i.target) || 0 !== n.has(i.target).length || m.hide("fast")
});
});.sidebar {
padding: 0 !important;
margin-top: 2%;
}
.sidebar a {
background-color: #122842;
padding: 3%;
color: white !important;
}
.sidebar .sidebar-submenu a {
color: #6e6e6e !important;
background-color: #e1ecf1 !important;
display: block;
}
.sidebar .current-menu-item a {
color: #22374f !important
}
.sidebar .sub-menu {
display: none;
}
.current-menu-ancestor .sub-menu {
display: block;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
<ul class="menu ">
<li class="sidebar current-menu-ancestor"><a href="#">Menu A ▶</a>
<ul class="sub-menu">
<li class="sidebar-submenu current-menu-item"><a href="a.com/menu1/">submenu 1</a>
</li>
<li class="sidebar-submenu current-menu-item"><a href="a.com/menu1/#sectionb">submenu 2</a>
</li>
<li class="sidebar-submenu"><a href="a.com/menu2">submenu 3</a>
</li>
</ul>
</li>
<li class="sidebar current-menu-ancestor"><a href="#">Menu B ▶</a>
<ul class="sub-menu">
<li class="sidebar-submenu current-menu-item"><a href="a.com/menu1/#sectionc">submenu 4</a>
</li>
<li class="sidebar-submenu"><a href="a.com/menu2/#sectionb">submenu 5</a>
</li>
<li class="sidebar-submenu"><a href="a.com/menu3">submenu 6</a>
</li>
</ul>
</li>
<li class="sidebar"><a href="#">Menu C ▶</a>
<ul class="sub-menu">
<li class="sidebar-submenu"><a href="a.com/menu4">submenu 7</a>
</li>
<li class="sidebar-submenu"><a href="a.com/menu5">submenu 8</a>
</li>
</ul>
</li>
</ul>これらは私が達成したい行動です：
- サブメニュー1サブメニュー2、およびサブメニュー4は、同じページ上にあるが、異なる 'メニュー' 。ページが選択されると、メニューCとメニューBの両方が展開され、メニューCは折りたたまれたままになります。
- メニューAの下にあるサブメニュー3をクリックすると、ページが読み込まれたときにメニューAとBが折りたたまれて展開されます。
- サブメニューがアクティブであるときはいつでも、クラス「現在のメニュー項目が」 に追加されたのliタグとクラス「現在のメニュー-祖先が」ULタグに追加され
私が持っている問題今：
- メニューが自動的にサブメニューがアクティブである場合、拡張が、メニューはクリック可能ではありません
私は以下のコードではjQueryを置き換え、メニューがクリック可能 と自動的に拡張されいずれかのサブメニューがctive、BUTサブ メニューがクリック可能ではない（リンクを開くない）
jQuery(document).ready(function(e){ jQuery('.sidebar a').click(function(e){ e.preventDefault(); if (jQuery(('.sidebar').children('.sub-menu:first').is(':visible')) { jQuery(('.sidebar').children('.sub-menu:first').hide(); } else { jQuery(('.sidebar').children('.sub-menu:first').show(); }}）。 }）;
ありがとうございます！