扩展<li>项目时保持滚动位置

时间:2020-02-03 11:43:18

标签: javascript html css asp.net

我正在制作一个引导程序侧菜单。 <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')

任何人都可以提供代码帮助或为我指明正确的方向吗?

1 个答案:

答案 0 :(得分:0)

这是由于您在#中使用的href替换为

href =“ JavaScript:Void(0);”

喜欢

<a class="nav-link collapsed" href="JavaScript:Void(0);" ...

第二个解决方案

只需使用“#/”或“#!”而不是“#”,页面就不会跳转。