Twitter bootstrap 在html表中正确创建引导手风琴

Twitter bootstrap 在html表中正确创建引导手风琴,twitter-bootstrap,html-table,accordion,Twitter Bootstrap,Html Table,Accordion,我发现了几个与我试图实现的目标相似的问题,实际上我举了一个例子,试图适应我想要实现的目标,但没有成功 我希望能够在一个常规html表中创建一个引导手风琴,但我似乎无法正确地实现它。如果我单击第一个单元格,它会展开手风琴的div,但当我单击第二个单元格时,该单元格也会显示。我如何才能使它正确地遵循手风琴风格,因为单击单个单元格一次只能折叠/展开单个部分 我同意多行被扩展,我觉得有一些明显的地方我遗漏了或者做错了。我在这方面已经研究了几个小时,但我仍然找不到答案。谁能告诉我我做错了什么 # 日期

我发现了几个与我试图实现的目标相似的问题,实际上我举了一个例子,试图适应我想要实现的目标,但没有成功

我希望能够在一个常规html表中创建一个引导手风琴,但我似乎无法正确地实现它。如果我单击第一个单元格,它会展开手风琴的div,但当我单击第二个单元格时,该单元格也会显示。我如何才能使它正确地遵循手风琴风格,因为单击单个单元格一次只能折叠/展开单个部分

我同意多行被扩展,我觉得有一些明显的地方我遗漏了或者做错了。我在这方面已经研究了几个小时,但我仍然找不到答案。谁能告诉我我做错了什么


#
日期
描述
信用
借记
平衡
1.
2013年5月5日
信用账户
$150.00
$150.00
演示1
演示22
2.
2013年5月5日
信用账户
$11.00
$161.00
演示2
3.
2013年5月5日
信用账户
$500.00
$661.00
演示3

看看这是否有帮助:我相信这就是你要做的,如果是这样的话,只是你的数据目标有点偏离

$('.accordian body').on('show.bs.collapse',function(){
$(此)。最近的(“表格”)
.find(“.collapse.in”)
.不是(这个)
.collapse('切换')
})
tbody tr.info td:hover{
背景色:#266080;
颜色:#fff;
-webkit转换持续时间:500ms;
-moz过渡持续时间:500ms;
-o-过渡持续时间:500ms;
过渡时间:500ms;
光标:指针;
}

折叠表格
名称
日期
电子邮件
电话
身份证#
一个
两个
三
四
五
亚甲
Sub-B
一个A
两岁
三甲
四甲
五A
六甲
一B
二B
三B
四B
五B
六B
一碳
双C
三C
四C
五C
六C
一维
二维
三维
四维
五维
六维

这是我用作基础的原始问题:这张桌子非常整洁,但据我所知,它似乎没有显示正确的手风琴行为。当我展开任何标题时,最后一个标题不应该自行折叠吗?我可以扩展所有部分并单独折叠它们,但我认为它应该只允许在任何时候显示单个部分。使用一些JS进行了修改。使用JS非常方便。您发布的解决方案是可行的,但接下来的问题自然是,您知道纯html标记是否可以实现这一点吗?无论哪种方式,这都能满足我的需求,并且可以根据我的数据集进行调整。谢谢不,没有js是不可能的。很抱歉