我正在制作一个引导程序侧菜单。 <li>
可以扩展和折叠以显示或隐藏其他菜单/链接。
当前,当我打开<li>
时,页面的滚动位置将重置为顶部。
我希望页面 <div id="wrapper">
<!-- Sidebar -->
<ul class="navbar-nav bg-gradient-primary sidebar sidebar-dark accordion" id="accordionSidebar">
<!-- Sidebar - Brand -->
<a class="sidebar-brand d-flex align-items-center justify-content-center" href="/">
<div class="sidebar-brand-icon rotate-n-15">
<i class="fas fa-briefcase"></i>
</div>
<div class="sidebar-brand-text mx-3">Business Centre</div>
</a>
<!-- Nav Item - Setting Collapse Menu -->
<li class="nav-item">
<a class="nav-link collapsed" href="#" data-toggle="collapse" data-target="#collapseAccount" aria-expanded="true" aria-controls="collapseAccount">
<i class="far fa-user-circle"></i>
<span>Account</span>
</a>
<div id="collapseAccount" class="collapse" aria-labelledby="headingAccount" data-parent="#accordionSidebar">
<div class="bg-white py-2 collapse-inner rounded">
<a class="collapse-item" href="login.html">Membership</a>
<a class="collapse-item" href="login.html">Information</a>
<a class="collapse-item" href="login.html">Contact Us</a>
</div>
</div>
</li>
</ul>
</div>
打开时保持其滚动位置。
这是一个片段:
trigger('change')
任何人都可以提供代码帮助或为我指明正确的方向吗?
答案 0 :(得分:0)
这是由于您在#
中使用的href
替换为
href =“ JavaScript:Void(0);”
喜欢
<a class="nav-link collapsed" href="JavaScript:Void(0);" ...
第二个解决方案
只需使用“#/”或“#!”而不是“#”,页面就不会跳转。