没有唯一标识符的Bootstrap折叠

时间:2015-02-06 16:04:07

标签: javascript jquery html css twitter-bootstrap

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

但我的元素是动态生成的,传递索引键是过度的。

现在发生的事情是,如果我切换element2的折叠,它将会崩溃element1。显然是因为他们有相同的身份证。

如果没有实际为每个可折叠元素提供唯一ID,是否有任何方法可以实现此目的?

这是一个功能性的小提琴:

http://jsfiddle.net/hhvrjnr3/

1 个答案:

答案 0 :(得分:13)

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

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

Example jsFiddle