Twitter bootstrap 3 我可以为Twitter引导崩溃指定多个数据目标吗？

我想在单击单个触发器时将两个div作为展开的目标？这可能吗？

对两个div使用相同的类，并根据此设置

数据目标。让您的div也具有相同的父级（也可以是类），并根据此设置
数据父级

<button type="button" class="btn btn-danger" data-parent="#wrap" data-toggle="collapse" data-target=".demo">
      simple collapsible
    </button>
    <div id="wrap">
    <div class="demo collapse">
    test1
    </div>
    <div class="demo collapse">
    test1
    </div>
    </div>


简单可折叠
测试1
测试1
您只需在数据目标中添加所有以逗号分隔的ID即可：

  <button type="button" class="btn btn-primary dropdown-toggle btn-sm" 
  data-toggle="collapse" data-target="#demo,#demo1,#demo2">Hide them all</button>

全部隐藏
如果要隐藏一个元素并显示另一个元素（如引导手风琴，但没有面板），可以添加多个目标，但也可以添加类“in”，以便在加载时展开一个元素

<div class="collapse text-center clearfix in" id="section1">
   <h1>This is section 1</h1>
   <p>Are you excited about toggling?</p>
</div>
<div class="collapse text-center clearfix alert-warning" id="section2">
   <h1>Boo!!</h1>
   <p>This is a new sentence</p>
</div>
<button class="btn btn-block btn-primary" data-toggle="collapse" data-target="#section1,#section2">Toggle</button>


这是第一节
你对切换感到兴奋吗

喝倒采
这是一个新句子

切换

来自：

数据目标属性接受CSS选择器以应用折叠

因此，对于
数据目标
属性值，可以使用逗号分隔的id列表、类选择器等：

<button class="btn btn-primary" type="button"
    data-toggle="collapse" data-target="#target1,#target2,#target3"
    aria-expanded="false" aria-controls="target1,target2,target3">



您可以在上看到大量有效的CSS选择器。
数据目标答案对我不起作用。但是，您可以使用JavaScript来实现这一点

让您的按钮调用一些JavaScript，如：

$('.collapse-class').collapse('toggle')

请参阅：。
引导程序4中有一个解决方案：


您至少需要：


数据切换的
data toggle=“collapse”data target=“.multi-collapse”
钮扣
class=“collapse multi-collapse”
针对需要执行的每个元素
拨动

（虽然数据目标中的多个ID确实不起作用）。
引导程序4使用document.querySelector而不是document.querySelector all。如果这种情况发生变化，那么一切都会正常工作。
在Bootstrap4中，为每个相应的div使用相同的类，似乎是在使用id



展示物品
可见行div 1
隐藏项

第2组
隐藏项2

虽然这种方法工作得很好，但如果第二个按钮指向这些ID中的任何一个，您将遇到问题。它不会显示第二个按钮，例如#demo、#demo3，而是会隐藏#demo，并将#demo3添加到显示的列表中。我认为类会比此解决方案更好。这可能无法完全起作用。Bootstrap.js只需要一个id。请参阅Bootstrap.js第551行左右（取决于您的版本）。此.$trigger设置为数据目标属性中引用了要显示的元素的任何元素。Bootstrap3：数据目标属性接受CSS选择器以将折叠应用于（）我使用的是Bootstrap 4.1.2，解决方案不起作用，它只针对后一个id，忽略引导源代码中的第一个id.exact复制/粘贴：值：函数_getTargetFromElement（元素）{var selector=_Util['default'].getSelectorFromElement（元素）；返回选择器？$（选择器）[0]：null；}so，你的解决方案根本不起作用。你有引导程序4的解决方案吗？@AndrewLam这应该也适用于引导程序4。状态：
或
可以通过在其
href
或
数据目标
属性中使用JQuery选择器引用多个元素来显示和隐藏它们。也许你可以试着指定一个类而不是多个ID？这似乎是这个页面上唯一有效的答案。我使用JavaScript中的类和作为数据目标的类对其进行了测试。当我在VueJS中以循环方式生成代码时，我需要这样做，ID（现在是类）被绑定到索引。谢谢