javascript - 没有唯一标识符的 Bootstrap 崩溃

Question

我正在尝试以不需要唯一标识符的方式使用 bootstrap collapse 插件。通常，页面上通常有一个或几个可折叠元素。

但是我的元素是动态生成的，传递索引键是多余的。

现在发生的情况是，如果我切换 element2 的折叠，它会折叠 element1。显然是因为它们具有相同的 ID。

有什么方法可以在不给每个可折叠元素一个唯一的 id 的情况下实现这一点？

这是一个函数式 js fiddle :

http://jsfiddle.net/hhvrjnr3/

Answer 1

这是可以做到的。首先从要折叠的元素中删除 data-target="#collapseExample"。然后向您的切换按钮添加一个额外的类，我添加了“折叠器”。这并不是真正需要的，但很高兴识别切换按钮。然后添加一些 jQuery 来进行切换，在这种情况下，我使用 next() 将后续元素获取到切换按钮，这是您希望折叠的元素。

$('.collapser').click(function() {
    $(this).next().collapse('toggle');
});

Example jsFiddle