在Bootstrap Accordion上,有没有办法在折叠时为标题添加固定的保存按钮?

时间:2013-10-04 18:42:36

标签: javascript html css html5 twitter-bootstrap

在Bootstrap手风琴上,是否有可能在折叠时为手风琴的标题添加固定的保存按钮?这样当用户扩展手风琴时,他们可以输入信息并始终从标题栏上的固定按钮保存它?见下文。

基本上(因为我无法发布图像)

这就是我的意思

* GT;手风琴的标题(折叠)[保存按钮]

* GT;手风琴的标题(扩展)[保存按钮]

输入框

输入框

* GT;手风琴的标题(折叠)[保存按钮]

1 个答案:

答案 0 :(得分:4)

在每个.accordion-heading内添加此HTML:

<button class="btn btn-save">Save</button>

然后添加这个CSS:

.btn-save{
    position:absolute;
    right:2px;
    top:2px;
}
.accordion-heading{
    position:relative;
}

这将在每个手风琴的每个标题内添加一个按钮,但单击该按钮不会展开或折叠手风琴。您可以为每个按钮指定不同的ID,然后使用它来附加事件处理程序。

JSFiddle:http://jsfiddle.net/jdwire/gz3s4/3/