javascript – Bootstrap Collapse.js切换隐藏/显示菜单

2023年5月28日 343次阅读

在bootstraps崩溃时出现问题.我有2个菜单项,下拉崩溃.我正在尝试交替/切换它们,所以我不能同时看到它们.我尝试过使用’toggle：false’,但似乎没有使用bootstrap.

请参阅codepen进行工作演示.目前我正在使用数据标签来创建功能.

我想知道DOM是否将崩溃功能视为两个独立的东西,因此不会将它们关联在一起.

所以我有

<div class="search-bar>...</div>
<div class="collapse" id="collapseExample">...</div>
<div class="collapse" id="collapseFilter">...</div>

在搜索栏内,我有2个锚元素触发崩溃.然后是一个不相关的下拉列表.

 <a id="search-button" data-toggle="collapse" href="#collapseExample">
    <span class="icon-search"></span>Search
 </a> <!--Simplified -->

所以我不确定为什么两个下拉崩溃元素都会崩溃.我希望它像accordion style一样工作

提前致谢.

最佳答案 您可以强制隐藏其他菜单,如下所示：

$("#search-button").click(function() {
    $('#collapseFilter').collapse('hide');
});

$("#filter-button").click(function() {
    $('#collapseExample').collapse('hide');
});

请参见演示的JsFiddle.我希望它有所帮助,谢谢

点赞