[英]How to apply toggle for child elements
When I clicked the button, the whole side bar is toggling, but I need only the side menus to get toggle.当我点击按钮时,整个侧边栏都在切换,但我只需要侧边菜单来切换。 HTML part HTML部分
<nav id="sidebar">
<div class="sidebar-header">
<img src="/fintantra/images/logo.jpg" style="margin-left:4px;">
<div class="btn-group">
.....
......
<ul class="list-unstyled components" id="demo">
<li>
<a href="#adminSubmenu" data-toggle="collapse" aria-expanded="false" class="dropdown-toggle">
<i class="fas fa-user"></i>
FDR
</a>
<ul class="collapse list-unstyled" id="adminSubmenu">
<li>
<a href="fpo-profile.html"><i class="fa fa-arrows-alt" aria-hidden="true"></i> FPO Profile</a>
</li>
....
</ul>
</li>
<li>
<a href="#fisSubmenu" data-toggle="collapse" aria-expanded="false" class="dropdown-toggle">
<i class="fas fa-user"></i>
FIS
</a>
<ul class="collapse list-unstyled" id="fisSubmenu">
<li>
<a href="fpo-profile.html"><i class="fa fa-arrows-alt" aria-hidden="true"></i> FPO Profile</a>
</li>
....
</ul>
</li>
...
</ul>
</nav>
<button type="button" id="sidebarCollapse" class="btn btn-info">
<i class="fas fa-align-left"></i>
<span>KANCHI</span>
</button>
JS Part JS部分
<script type="text/javascript">
$(document).ready(function () {
$('#sidebarCollapse').on('click', function () {
$('#sidebar').toggleClass('active');
});
});
</script>
The above code is working for the whole sidebar and when I replace ('#sidebar') with ('#demo') it is not toggling.上面的代码适用于整个侧边栏,当我用 ('#demo') 替换 ('#sidebar') 时,它不会切换。 I'm using demo as id in the menu ul section.我在菜单 ul 部分使用演示作为 id。
<script type="text/javascript">
$(document).ready(function () {
$('#sidebarCollapse').on('click', function () {
$('#demo').toggleClass('active');
});
});
</script>
<script type="text/javascript">
$(document).ready(function () {
$('#sidebarCollapse').on('click', function () {
$('#demo').toggle();
});
});
</script>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.