您好,我已经创建了一个下拉侧边栏菜单,但是当我单击主菜单时出现问题,它正确显示子菜单,但问题是当我单击子菜单时,它没有打开它被隐藏的链接。这是的代码。
<aside id="sidebar-wrapper">
<div class="sidebar-brand">
<h2>Materno Platform</h2>
</div>
<ul class="sidebar-nav">
<li><a href="index.html">Dashboard</a></li>
<li><a href="#">Customers</a></li>
<li><a href="#">providers</a></li>
<li><a href="#">User Management</a></li>
<li><a href="#">Plans</a></li>
<li class="has-ul"><a href="#">Order Fullfillment<i class="fa fa-plus"></i></a>
<ul class="sub-ul">
<li><a href="#">Plan Purchases</a></li>
<li><a href="#">Med Orders</a></li>
<li><a href="#">Lab Orders</a></li>
<li><a href="#">predictive Analytics</a></li>
</ul>
</li>
<li class="has-ul"><a href="#">Master Data Management<i class="fa fa-plus"></i></a>
<ul class="sub-ul">
<li><a href="careplans.html">Care Plans</a></li>
</ul>
</li>
<li><a href="#">Transcriptions</a></li>
<li><a href="profile.html">Profile</a></li>
</ul>
</aside>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script type="text/javascript">
$("#sidebar-toggle").click(function(e) {
e.preventDefault();
$("#wrapper").toggleClass("toggled");
});
$('li.has-ul').click(function() {
$(this).children('.sub-ul').slideToggle(500);
$(this).toggleClass('active');
event.preventDefault();
});
fiddle 链接:https://jsfiddle.net/3yfdcto0/1/
最佳答案
改变 Jquery
$('li.has-ul a').click(function() {
$(this).parent().find('.sub-ul').slideToggle(500);
$(this).parent().toggleClass('active');
/*event.preventDefault();*/
});
关于javascript - 单击子菜单未打开页面它隐藏了 HTML 中的子菜单,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/56455397/