在 bootstrap 中做折叠效果如下:
<p>
<a class="btn btn-primary" data-toggle="collapse" href="#collapseExample" aria-expanded="false" aria-controls="collapseExample">
Link with href
</a>
<button class="btn btn-primary" type="button" data-toggle="collapse" data-target="#collapseExample" aria-expanded="false" aria-controls="collapseExample">
Button with data-target
</button>
</p>
<div class="collapse" id="collapseExample">
<div class="card card-block">
Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident.
</div>
</div>
为什么按钮会引用类 data-toggle=collapse
和面板的 id data-target=#collapseExample
来实现效果?仅仅获得足够的 ID 是否足以切换其状态?
是不是因为 data-toggle 指的是它要使用什么样的效果,所以用它来定位面板?
最佳答案
同时使用 data-toggle
和 data-target
属性是因为 data-toggle
也被其他 Bootstrap 组件使用(即;折叠、模态、选项卡、下拉列表等)。
通过指定 data-toggle="collapse"
,您告诉 Bootstrap API 将折叠行为应用于 data-target
指定的元素。如果您只指定了 data-target
,API 就无法理解是哪个 Component将被使用。
关于jquery - 为什么 bootstrap 需要类名和 Id 名才能崩溃?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41705963/