在Bootstrap 3 accordion中添加动态闭合面板
在Bootstrap 3 accordion中添加动态闭合面板
提问于 2013-09-16 18:37:59
我使用的是Bootstrap 3 accordion，我需要在其中添加动态面板。我有这样的东西：
+------------------+
| Panel 1 (closed) |
+------------------+
| Panel 2 (opened) | <-- This is the template panel
| CONTENT |
+------------------+
| Dynamic panels | <-- All dynamic panels must be closed, not opened
+------------------+ after they are added问题是，如果打开Panel 2，则会打开动态面板(从Panel 2克隆)。如果关闭配电盘2，则关闭动态配电盘。
我希望所有的动态面板都是关闭的，只有当它们的头被点击时，它们才会被打开(就像在Bootstrap示例中一样)。我怎么才能修复它？
这是我的jQuery代码。
var $template = $(".template");
var hash = 2;
$(".btn-add-panel").on("click", function () {
var $newPanel = $template.clone();
// I thought that .in class makes the panel to be opened
$newPanel.find(".collapse").removeClass("in");
$newPanel.find(".accordion-toggle").attr("href", "#" + (++hash))
.text("Dynamic panel #" + hash);
$newPanel.find(".panel-collapse").attr("id", hash);
$("#accordion").append($newPanel.fadeIn());
});回答 1
Stack Overflow用户
回答已采纳
发布于 2013-09-16 18:59:08
我刚刚在这一行添加了addClass("collapse")：
$newPanel.find(".panel-collapse").attr("id", hash).addClass("collapse").removeClass("in");
var $template = $(".template");
var hash = 2;
$(".btn-add-panel").on("click", function () {
var $newPanel = $template.clone();
$newPanel.find(".collapse").removeClass("in");
$newPanel.find(".accordion-toggle").attr("href", "#" + (++hash))
.text("Dynamic panel #" + hash);
$newPanel.find(".panel-collapse")
.attr("id", hash)
.addClass("collapse")
.removeClass("in");
$("#accordion").append($newPanel.fadeIn());
});页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/18825975
复制相关文章
相似问题