Bootstrap accordion horizontal (inline-block) -折叠问题
Bootstrap accordion horizontal (inline-block) -折叠问题是指使用Bootstrap框架中的折叠组件accordion，并将其水平排列在一行中的布局问题。
折叠组件accordion是Bootstrap中常用的UI组件之一，用于创建可折叠的内容区域。它通常由一个标题和一个内容区域组成，用户点击标题时可以展开或折叠内容区域。
在默认情况下，Bootstrap的折叠组件accordion是垂直排列的，即每个折叠项占据一整行。然而，有时候我们希望将折叠项水平排列在一行中，以节省空间或满足特定的布局需求。
要实现Bootstrap accordion水平排列的布局，可以借助CSS的inline-block属性。通过将折叠项的父容器设置为display: inline-block，可以使折叠项在一行中水平排列。
以下是一个示例代码：
<div class="accordion-horizontal">
<div class="accordion-item">
<h2 class="accordion-header" id="heading1">
<button class="accordion-button" type="button" data-bs-toggle="collapse" data-bs-target="#collapse1" aria-expanded="true" aria-controls="collapse1">
折叠项1
</button>
</h2>
<div id="collapse1" class="accordion-collapse collapse show" aria-labelledby="heading1" data-bs-parent=".accordion-horizontal">
<div class="accordion-body">
折叠项1的内容
</div>
</div>
</div>
<div class="accordion-item">
<h2 class="accordion-header" id="heading2">
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapse2" aria-expanded="false" aria-controls="collapse2">
折叠项2
</button>
</h2>
<div id="collapse2" class="accordion-collapse collapse" aria-labelledby="heading2" data-bs-parent=".accordion-horizontal">
<div class="accordion-body">
折叠项2的内容
</div>
</div>
</div>
<div class="accordion-item">
<h2 class="accordion-header" id="heading3">
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapse3" aria-expanded="false" aria-controls="collapse3">
折叠项3
</button>
</h2>
<div id="collapse3" class="accordion-collapse collapse" aria-labelledby="heading3" data-bs-parent=".accordion-horizontal">
<div class="accordion-body">
折叠项3的内容
</div>
</div>
</div>
</div>在上述示例代码中，我们给折叠项的父容器添加了class="accordion-horizontal"，并使用了内置的Bootstrap样式类来实现水平排列的效果。同时，我们还需要设置每个折叠项的data-bs-parent属性为".accordion-horizontal"，以确保它们在同一个父容器下。
这样，就可以实现Bootstrap accordion水平排列的布局。
推荐的腾讯云相关产品和产品介绍链接地址：
- 腾讯云服务器（CVM）：提供可扩展的云服务器实例，满足各种计算需求。产品介绍链接
- 腾讯云对象存储（COS）：提供安全可靠、低成本的云端存储服务，适用于各种场景。产品介绍链接
- 腾讯云数据库（TencentDB）：提供高性能、可扩展的云数据库服务，支持多种数据库引擎。产品介绍链接
- 腾讯云人工智能（AI）：提供丰富的人工智能服务和解决方案，包括图像识别、语音识别、自然语言处理等。产品介绍链接
- 腾讯云物联网（IoT）：提供全面的物联网解决方案，帮助用户快速构建和管理物联网应用。产品介绍链接
- 腾讯云区块链（Blockchain）：提供安全可信的区块链服务，支持快速搭建和部署区块链网络。产品介绍链接
- 腾讯云音视频（VOD）：提供高可靠、高并发的音视频处理和分发服务，适用于各种音视频应用场景。产品介绍链接
以上是关于Bootstrap accordion horizontal (inline-block) -折叠问题的完善且全面的答案。
相关·内容
我在网站上有bootstrap accordion，它是水平放置的(内嵌块面板)
Bootply -
当我试图打开图像下面的文本面板时出现问题，因为所有其他三个面板都滚动到折叠面板组的底部。示例- ...
你能帮助我如何修复所有的面板，当打开任何面板正文文本的顶部？
当我将.panel-default样式更改为position: absolute时，所有四个面板都出现在彼此的上方。Live example here -
浏览 6提问于2016-07-14得票数 1
回答已采纳
我正在尝试实现twitter bootstrap can plugin ()，但我似乎无法让它正常工作。我认为这是我的开发环境出了问题，所以我设置了一个JSfiddle，但我仍然收到相同的问题。下面是jsfiddle：
这是直接从bootstrap示例复制的HTML。
<div class="accordion" id="accordion2">
<div class="accordion-group">
<div class="accordion-heading">
浏览 0提问于2013-04-10得票数 8
回答已采纳
我正在尝试让一个基本的bootstrap崩溃工作。但是，我当前的代码不能展开或折叠折叠。相反，当您点击按钮时，页面会跳转到折叠正文所在的位置，而不会折叠它。我真的很困惑，因为根据bootstrap网站的说法，这似乎是正确的。下面是我的代码：
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Accordion</title>
<link rel="stylesheet" type=
浏览 0提问于2013-05-01得票数 1
回答已采纳
有没有人可以提到如何以编程方式打开/折叠bootstrap accordion。这是我的uibinder xml for ACCORDION小部件。我想把它折叠成我的uibinder java类。
<b:Accordion>
<b:AccordionGroup heading="COMPARE" ui:field="compareAccordion">
.
.
.
</b:AccordionGroup>
</b:Accordion>
浏览 1提问于2013-07-17得票数 1
1回答
引导折叠类不能正确切换
、、、
我正在尝试使用Bootstrap崩溃类。我有两个问题。第一种情况是，当我最初单击“折叠”按钮时，需要第二次单击才能折叠div。第二，当它折叠时，div包含的文本仍然是可见的。我可以看出塌陷是在做些什么，因为我在外部div周围加了一个边框。
JSFiddle演示了这个问题：
<div style="border: 3px solid #A9A9A9">
<button data-toggle="collapse"
data-target="#Info_Collapse"
class=&#
浏览 0提问于2018-01-18得票数 2
回答已采纳
我是JQuery的新手，所以如果这个问题看起来微不足道，请原谅。我有一个页面，如下面的HTML所示，其中包含三个选项卡元素，每个选项卡元素中可能包含数量不详的可折叠元素。我使用一个名为'groupings‘的python字典从服务器传递数据，它的结构如下：
groupings = {tab1: [[group, [(key, value), ...]], ...], ...}
我使用Twitter Bootstrap作为前端框架，使用Jinja2作为模板引擎，在后端使用Python2.7。我不能用下面的代码激活可折叠元素。我猜所需的JQuery与Bootstrap文档中提供的有所不同。
浏览 0提问于2012-10-08得票数 1
回答已采纳
11回答
我正在尝试使用Bootstrap创建一个可折叠的组件。我的代码是
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
<script src="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
<div class="panel-group&
浏览 152提问于2014-04-09得票数 36
回答已采纳
我使用的是一个非常基本的Bootstrap折叠。我的代码取自Bootstrap docs (2.2)模板。
但是，当我单击一个标题来折叠一个部分时，该部分会向上滑动，但内容在消失之前仍然可见2-3秒。
由于它不一致，我尝试了一下，并注意到它通常发生在单击折叠部分的链接后，光标位于内容的顶部。
有没有人遇到过这种行为？有什么办法防止这种情况发生吗？
我的代码：
<div class="accordion" id="accordion2">
<div class="accordion-group" id="
浏览 0提问于2013-08-01得票数 0
当Twitter Bootstrap的手风琴折叠和展开时，我希望有一个项目符号更改/交换。我在子弹上用了背景图片。
现在，在这个jsfiddle中，当页面加载时，应用的项目符号是'-‘。但在项目展开和折叠后，它会保留'+‘项目符号。我想要从头开始的'+‘符号。
谢谢。
@import url('http://twitter.github.com/bootstrap/assets/css/bootstrap.css');
.container {
margin-top: 10px;
}
.accordion .accordion-group .a
浏览 4提问于2013-04-16得票数 0
回答已采纳
我有一个带Bootstrap的simple example，可以通过点击切换div。下面是标记： <div class="accordion-heading">
<a class="accordion-toggle"
data-toggle="collapse"
data-parent="#accordion2"
href="#collapseOne">Open!</a>
</div>
<div id="
浏览 62提问于2016-09-02得票数 10
回答已采纳
1回答
我正在工作的反应-自举手风琴，我已经准备了一个良好的工作演示。我喜欢手风琴如何打开和关闭的动画。这里发生的事情是，我没有在项目的其他部分使用bootstrap css。所以我只需要手风琴的鞋带。此外，bootstrap正在影响页面上其他元素的样式。
是否可以使用bootstrap.min.css中唯一的手风琴CSS？因为只为css的156KB加载accordion似乎有点不寻常。
这是我尝试过的
import React from "react";
import "./App.css";
import "bootstrap/dist/css/bootst
浏览 3提问于2020-01-21得票数 0
我正在尝试使用Twitter Bootstrap折叠组件实现一个100%高度的accordion，就像这个中所描述的那样。
我按照这个中的描述手动设置.accordion-inner元素的高度。
然而，在展开/折叠面板时，我遇到了“弹跳”行为。我已经从.accordion-inner元素中删除了所有的填充/边距/边框，以消除这种可能性。
这个问题在IE10中最为明显，然而这个问题在Chrome中也很明显。
请参阅此。
你知道是什么导致了这种“神经质”的行为吗？
浏览 0提问于2013-05-20得票数 11
回答已采纳
0回答
Jquery点击事件
、、、、
我正在使用bootstrap accordion。我希望能够存储手风琴的状态。我决定使用本地存储。如果用户关闭了折叠，我想要清除localstorage，这样它就不会一直打开。我已经把这些都做好了。我的问题是，当用户点击打开/关闭accordion的链接时，我正在对类进行“折叠”检查。当它被点击时，我假设如果它有类“折叠”，我可以清除localstorage。但出于某种原因，情况恰恰相反。如果我否定它，一切都是好的。我没看到的是什么？
$('.accordion-right').click(function() {
if (!$(this).hasClass(
浏览 10提问于2017-06-13得票数 0
我的手风琴手风琴有问题。()
首先，一个显示问题的jsfiddle：
可折叠的组项目工作正常。接下来，我得到了一个隐藏和显示可折叠组项目的代码。它也可以工作，但如果用户执行这些步骤(所有代码示例都来自jsfiddle，我已经将代码减少到最少，所以不要搜索任何逻辑)：
1)活动组项目被隐藏。
$(".accordion-group").first().hide();
2)用户打开第二组项目(可见)。
3)显示先前隐藏的组项
$(".accordion-group").first().show();
4)用户无法打开第一个组项目...
如果第一个组项目在隐藏时被折叠
浏览 1提问于2013-04-29得票数 1
如何根据用户的选择展开和折叠Bootstrap accordion面板意味着如果我展开A可折叠面板，然后展开B可折叠面板，则A不应该折叠。如果用户想要折叠它，那么可以通过单击符号来完成。
浏览 1提问于2015-08-13得票数 1
我有一个手风琴崩溃的问题。它以前工作得很好，但在某个时间点上坏了，我不完全确定这是否与Bootstrap 3升级有关。我最近重写了这个项目的一半，所以有可能是我无意中做的事情。
我用KnockoutJS创建了一个很大的手风琴。它填充了组/面板，并按预期打开，但当我尝试折叠一个组时，组的内容会移动到封闭容器的顶部，然后组会折叠，但它的内容仍然会停留大约一秒钟，直到它最终消失，我得到了预期的结果-折叠的手风琴。
<div id="accordion" class="accordion">
<div class="accordion-gr
浏览 3提问于2014-12-16得票数 3
1回答
我有一个关于bootstrap中使用的手风琴的问题。
在我的页面上，有多个手风琴使用不同的is，因为不同的内容通过Kendo加载到每个手风琴中。
我想要能够做的是当点击一个打开一个手风琴的链接时折叠所有的手风琴…
我想一个例子就是
#accordion1 //is expanded
#accordion2 //is expanded
#accordion3 //is expanded
#accordion4 //is collapsed
link clicked expands accordion4
\#accordion1 //is expanded
\#accordion2 //is
浏览 1提问于2015-01-15得票数 0
1回答
我正在使用Bootstrap accordion menu ，我希望它在可折叠不折叠时在文本前有小+号，在可折叠时在文本前有小符号。我正在使用以下事件侦听器
$('.collapse').on('show', function(e){
$('.collapsed-status').innerHTML('- ');
});
$('.collapse').on('hide', function(e){
$('.collapsed-status
浏览 0提问于2013-06-10得票数 1
回答已采纳
在Angular 6中，我迭代了一个数据集，以便动态地创建一个折叠/折叠。问题是Bootstrap是在页面加载时初始化的，然而，这个accordion是在页面加载之后、API调用之后创建的。因此，在呈现accordion之后，它不是交互式的，因为新的DOM元素不是在页面加载时初始化bootstrap时挑选的。
如果我能让bootstrap完全从JS重新初始化，那就太好了。
否则，我需要找到一种方法来重新初始化Bootstrap折叠，这样它就可以拾取所有新添加的DOM。这是标记。我尝试过像文档中说的那样使用$('.collapse').collapse()，但它只折叠内容，不会初
浏览 0提问于2020-07-10得票数 0
1回答
我使用的是推特Bootstrap和jQuery。
根据bootstrap文档，如果您想要默认打开可折叠元素，则需要添加额外的类"in“。如果您想要折叠元素作为默认设置，您可以将高度设置为0px。
这一切都运行得很好。
我想使用媒体查询将元素设置为在大屏幕上默认打开，在小屏幕上默认折叠(然后单击以切换两者)...
我的HTML：
<div class="accordion" id="accordion1">
<div class="accordion-group">
<div class="acc
浏览 35提问于2013-09-16得票数 7
1回答
折叠/折叠不能像我想要的那样工作，下面是我的代码：
下面是在脚本标记中包含JS的视图：
<div id="accordion" class="panel-group">
<div class="panel">
<div class="panel-heading">
<h4 class="panel-title">
<a href="#panelBodyOne" cla
浏览 0提问于2018-10-15得票数 0
我在堆栈溢出：Closing parent accordion needs to close all children accordion上找到了这个主题，它或多或少包含了我正在搜索的内容。 我正在使用bootstrap 4，我的问题是，我不知道如何改编其他主题的代码，以便在关闭主折叠卡片时关闭折叠和单个可折叠项目…… 有人能帮上忙吗？下面是我的小提琴示例： https://jsfiddle.net/fgh0qw9x/ 到目前为止，我尝试的是像这样修改代码： closeChildrenAccordion : function (accordion) {
if (jQ
浏览 14提问于2019-07-02得票数 0
我注意到，在使用accordions时，使用的是“class”类，不要将它与data-toggle=“class”混淆。当我测试如果移除折叠的类会发生什么，那么，即使没有向按钮发出折叠的类，accordion也能正常工作。例如，您可以在以下链接中查看accordion示例：https://getbootstrap.com/docs/4.0/components/collapse/ <button class="btn btn-link collapsed"... 有没有人能解释一下什么是类“崩溃”，它是做什么的？ 我在SO中注意到了以下问题，但没有关于折叠的类功能的解释
浏览 13提问于2021-09-30得票数 1
回答已采纳
1回答
折叠时将类添加到折叠切换
、、、
在React中，我使用了'react-bootstrap‘模块。当我使用Bootstrap accordion显示项目列表时。当"Accordion.Collapse“崩溃时，我需要在"Accordion.Toggle”中添加一个类。我试过使用react onClick函数，但它在每一次点击时都能工作，就像之前的"Accordion.Toggle“类在新的类折叠时不会被移除一样。
注意:如果我直接使用Bootstrap CSS和JS而不使用Bootstrap节点模块，这是可能的。Bootstrap提供了一个称为“called”的类。作为参考，
clas
浏览 6提问于2019-07-28得票数 4
在Bootstrap accordion中，我不需要单击a文本，而是希望在单击panel-heading div中的任意位置时将其折叠。
我用的是Bootstrap 3，所以它不是手风琴，而是一个可折叠的面板。你知道怎么做整个面板可点击吗？
浏览 62提问于2013-10-08得票数 169
回答已采纳
1回答
我已经创建了一个带bootstrap折叠的手风琴。折叠面板中的某些元素在单击特定元素时展开时会替换。将创建以下标记：
<div class="accordion" id="accordion2">
<div class="accordion-group">
<div class="accordion-heading">
<a class="accordion-toggle" href="
浏览 1提问于2012-11-02得票数 5
回答已采纳
当您第一次单击打开IE7/8/9中的引导带“可折叠”手风琴时，它不会打开。其他人遇到这种情况或者能找出原因吗？
谢谢
jsfiddle演示：
<div class="accordion category-list-accordion">
<div id="category-5" class="accordion-group" style="display: block; ">
<div class="accordion-heading">
浏览 1提问于2012-10-08得票数 7
回答已采纳
我想在页面加载时折叠accordion，我使用is-open="group.isOpen“，但它不起作用。
代码：
<accordion>
<accordion-group is-open="group.isOpen" ng-repeat="session in sessions.list" >
<accordion-heading>
<span>{{session.title}} : </span>
<span>{{session.schedule
浏览 0提问于2014-08-23得票数 1
我无法让Bootstrap accordion折叠在Firefox上正常工作。如果我单击accordion标题，它会显示一秒钟的内容，但不会保持打开状态。我也试过使用"toggle“："hidden"，但也不起作用。任何反馈或帮助都非常感谢，谢谢！
下面是我的代码：
<!DOCTYPE html>
<head>
<script src="/js/bootstrap-collapse.js"></script>
<script>
$(document).ready
浏览 1提问于2013-04-21得票数 1
回答已采纳
我正在尝试修改Bootstrap折叠插件，以允许我指定单击一个accordion (打开)是否应该自动关闭accordion中的其他项目(以便一次可以打开accordion中的多个项目)
我想在折叠面板上创建一个新的数据属性，类似于data-collapse-type="auto|manual"
对于我的技术水平来说，bootstrap jQuery插件有点高级。我需要处理的最相关的部分似乎在第52行，actives.collapse('hide')。如果设置了‘data-collapse type=“manual”’，我不希望发生这种情况(省略该属性或设置au
浏览 1提问于2012-04-05得票数 62
回答已采纳
3回答
我是jQuery的新手，正在尝试为twitter bootstrap accordion插件设置一个通用的展开/折叠按钮。在我的代码中，我有一个数组div的I，我想要展开/collaspe，我使用的循环可以很好地完成这一任务。
但是，如果我通过单击accordion-heading链接来手动展开/整理accordions，那么相关的div不会再展开或折叠，即使"in“类被很好地添加了。
下面是我的循环：
for(i=0;i<selectedRows.length;i++){
if($("#"+a).find("div#collapse_"+
浏览 2提问于2013-01-07得票数 1
1回答
我试图使用一个引导折叠面板成一个角组件。根据我所看到的，引导方法是使用面板的id来折叠。这作为独立的工作，然而，当使用到一个角分量，相同的id创建一个不希望的效果，当切换之间的折叠和不崩溃模式。(第一个面板总是折叠/未折叠)
下一步是创建自定义折叠面板。这是工作的，可以在这里看到，但崩溃的效果是不一样的(柱塞链接显示在平行的我的面板和引导面板)。
我的问题是如何在组件中使用引导面板，或者如何更改css，使其在崩溃/未崩溃时具有相同的引导效果。？
<custom-filter-accordion button-text="Expand / Collapse Non-BootStr
浏览 3提问于2016-07-18得票数 0
回答已采纳
2回答
手风琴不会折叠
、、、
下面的手风琴代码对我来说不能正常工作。
<div class="accordion" id="accordion1">
<div class="accordion-group">
<div class="accordion-heading">
<a class="accordion-toggle" data-toggle="collapse"
data-parent="#accordion1&
浏览 1提问于2012-09-29得票数 10
回答已采纳
4回答
我使用的是bootstrap-cliumse.js v2.0.3。我有两个关于显示/隐藏手风琴的问题。1.需要折叠默认展开的第一个折叠body。为了显示第一个手风琴，我调用了$('#Head_1').collapse ('show');，但它不工作。2.点击div#Head_2需要折叠展开的，需要展开Head_2。为此，我在此呼吁
$('#Head_1').collapse ('hide');
$('#Head_2').collapse ('show');
在这种情况下，Head_2会展开，但Hea
浏览 1提问于2014-03-27得票数 1
2回答
父范围更新子范围
、、、
我发现了许多从子作用域更新父作用域变量的方法，即Dot，但在我的例子中，这并没有帮助。
我有ui引导手风琴，它打开和折叠根据isOpen变量，我从后端传递它。
angular.module('plunker', ['ui.bootstrap']);
function AccordionDemoCtrl($scope) {
$scope.currentPage = 1;
$scope.items = [{
label: 'Item 1',
open: true
}, {
label: 'Item 2
浏览 3提问于2015-04-22得票数 0
回答已采纳
1回答
我正在尝试使用twitter引导程序网站上提供的示例来实现崩溃。当我尝试这段代码时，点击链接来折叠内容什么也不会做。这是我的代码：
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Test</title>
<link href="../css/bootstrap.css" rel=&#
浏览 3提问于2013-08-12得票数 8
回答已采纳
我正在尝试在我的应用程序中自定义一个折叠。我试过AngularJS UI Bootstrap附带的手风琴插件，但它相当复杂，因为我只需要两个并排的链接，折叠的元素在下面打开，所以我决定包含Bootstrap中的transition.js和collapse.js。
到目前为止，我的代码如下所示：
<div class="logo" id="accordion">
<a data-parent="#accordion" data-toggle="collapse" data-target="#lo
浏览 0提问于2014-04-23得票数 0
有没有办法禁用react-bootstrap accordion上的自动折叠? Ex:如果用户想一次打开两个内容，那么他可以 <Accordion>
<Card>
<Card.Header>
<Accordion.Toggle as={Button} variant="link" eventKey="0">
浏览 25提问于2019-12-24得票数 0
1回答
我正在使用引导带折叠实现一个可折叠面板，如此所示，我想知道是否有可能保持一个面板打开，而另一个面板被打开，并且该面板仅在其自己面板的箭头单击时关闭。
我已经把css部分的代码。
.panel-heading .accordion-toggle:after {
/* symbol for "opening" panels */
font-family: 'Glyphicons Halflings'; /* essential for enabling glyphicon */
content: "\e114"; /* adjust as n
浏览 3提问于2017-05-17得票数 0
回答已采纳
1回答
我有一个嵌套的Bootstrap折叠，在父折叠和子折叠上都会触发一个显示的事件。我需要它只在父级崩溃上发射，而不是在子级上发射。
$(document).ready(function() {
$("#accordion2").on("shown",function() {
alert("shown!");
});
});
下面是一个例子：
浏览 3提问于2013-01-15得票数 7
回答已采纳
使用Bootstrap 2.3.2，我有一个带有单个面板的手风琴，该面板在页面加载时是打开的。
<div class="accordion" id="refine">
<div class="accordion-heading">
<a class="accordion-toggle" data-toggle="collapse" data-parent="#refine" href=
浏览 0提问于2013-08-08得票数 7
2回答
我使用的是bootstrap提供的折叠插件，这是一个jquery简单插件
但是默认情况下会折叠，如何修改才能使折叠项在默认情况下隐藏，只有当我按下标题时，项才会折叠并显示？谢谢
$(document).ready( function () {
$(".collapse").collapse()({
toggle: false,
show: false
});
} );
这是html：
<div class="accordion-group">
<div class="alert alert-info
浏览 3提问于2012-04-14得票数 21
回答已采纳
我使用了bootstrap accordion，它有3个静态面板和一个由Angular Selector添加的动态面板。由于选择器，一个额外的div包装了第四个面板，因此该面板不再直接位于panel-group下。所以折叠适用于3个静态面板，但不适用于accordion中动态添加的面板:更详细地说，在展开第四个面板后，当我尝试单击前三个面板中的任何一个时，第四个面板没有折叠。
我已经复制了我的问题。
我知道解决这个问题的一种很糟糕的方法是使用jquery，然后手动使折叠面板折叠。有没有更好的办法？
更新：是一个更新的链接，其中动态生成的内容有两个面板，由额外的div包装。如前所述，面板4和面板
浏览 18提问于2018-02-28得票数 1
我正在使用twitter bootstrap 3和accordion模块，我想要这样做:一个显示'show‘的按钮，当它显示时，一个显示’折叠‘的按钮。
我尝试过使用数据属性，但不起作用。
手风琴在django的循环中。
谢谢
我正在使用这个js
$('a.accordion-toggle').click(function() {
if ( $(this).next('.accordion-body').hasClass('in') ) {
$(this).text('Close');
}
浏览 5提问于2014-02-05得票数 1
2回答
这是我的html视图：
$('.collapse').on('shown.bs.collapse', function(){
$(this).parent().find(".fa-chevron-right").removeClass("fa-chevron-right").addClass("fa-chevron-up");
}).on('hidden.bs.collapse', function(){
$(this).parent().find(".fa-ch
浏览 6提问于2020-12-15得票数 1
帮助，我正在寻找在bootstrap 3中折叠时的字形图像交换。我在这里发现这个线程这在jsfiddle中工作，但当复制到我自己的页面时，折叠工作，但图标不能从上到下交换。我是不是漏掉了什么？我甚至把它放在Bootstrap 3的完整下载版本中，但图标无法换出。代码如下：
<div class="panel-group" id="accordion">
<div class="panel panel-default">
<div class="panel-heading">
<h4 c
浏览 3提问于2013-09-06得票数 4
2回答
折叠引导4
、、
我最近为Bootstrap 4安装了一个折叠。当我点击显示卡片时，这很好，工作，问题是第二次点击，它没有折叠内容。我已经发布了代码，如果你能识别出问题，请告诉我 <div id="accordion">
<div class="card">
<div class="card-header" id="headingTwo">
<h5 class="mb-0">
<button cla
浏览 16提问于2020-07-05得票数 1
我刚接触编程和Twitter Bootstrap大约2个月，所以请善待我！
我做了很多挖掘和搜索，但我不确定我用的是正确的术语，所以我想我应该直接问。
我正在尝试创建一个展开/折叠全部按钮，它将展开或折叠标题标题下的所有项目。标题标题下的项包括文本片段和图像。我希望能够通过单击标题标题来展开/折叠文本部分。我希望能够通过单击按钮来展开/折叠文本和图像。
问题是:我想按下按钮来展开/折叠所有内容，而不管文本片段是展开还是折叠。
这是jsfiddle：
正如您所看到的，该按钮将切换项的打开或关闭，而不是它们的当前状态。有没有一种方法可以进行“通用”展开/折叠，而不管嵌套项是展开还是折叠？
基本上，
浏览 3提问于2013-04-25得票数 1
我正在使用bootstrap accordion创建一个使用XSLT的FAQ列表。它使用默认的‘折叠’javascript来切换一个标题来显示描述。请看下面的代码：
<div class="span9 faqswhole">
<xsl:for-each select="$currentPage/faqs">
<div class="accordion" id="accordion">
<!--accordion group-->
浏览 0提问于2014-04-20得票数 1
我使用的是bootstrap折叠元素。当我展开一个手风琴组时，另一个关闭。如果我不想让另一个手风琴在被点击时关闭，该怎么办？
<div class='accordion-group'>" + "<div class='accordion-heading' style='font-size:15px;'>" + "<a class='accordion-toggle collapsed' data-toggle='collapse' data-parent
浏览 1提问于2013-08-29得票数 0
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
即时通信 IM
实时音视频活动推荐
腾讯云开发者
