Javascript jquery展开/折叠所有项
我有一堆项目,可以通过单击图标来分别折叠/展开。 我需要进一步修改我的代码。我需要在顶部添加另一个图标。当您单击该按钮时,可以展开/折叠 一次完成以下所有项目。有人能帮我做那个部分吗 这是我的javascript代码Javascript jquery展开/折叠所有项,javascript,css,ajax,jquery,Javascript,Css,Ajax,Jquery,我有一堆项目,可以通过单击图标来分别折叠/展开。 我需要进一步修改我的代码。我需要在顶部添加另一个图标。当您单击该按钮时,可以展开/折叠 一次完成以下所有项目。有人能帮我做那个部分吗 这是我的javascript代码 $(document).on('show hide', '#programs-accordion', function(e) { $(e.target).siblings('.accordion-heading').find('.accordion-toggle i').tog
$(document).on('show hide', '#programs-accordion', function(e) {
$(e.target).siblings('.accordion-heading').find('.accordion-toggle i').toggleClass('icon-plus icon-minus');
});
这是我的haml代码
#programs-accordion.accordion
- @patient_summary.programs.each_with_index do |program, index|
.accordion-group
.accordion-heading
.accordion-toggle.group-accordion-toggle
%a{ href: "#collapse-#{index}", data: { parent: '#programs-accordion', toggle: 'collapse' }}
%i.icon-plus
%a= program.name
.accordion-body{id: "collapse-#{index}", class: (@office.to_i == office.id) ? "" : "collapse" }
.accordion-inner
- office.positions.each_with_index do |position, index|
#measures-accordion.accordion
.accordion-group
.accordion-heading
.row-fluid
.span2{class: "offices-#{position.status}"}= position.status
.span1= position.results.first.value
.span2= position.results.first.value_date_time.blank? ? '' : Date.parse(position.results.first.value_date_time)
.span5= position.name
编辑:JS fiddle链接如下
可能是这样的:
$('.expandButton').click(function() {
$('.accordion-body').addClass('collapsed');
$('.accordion-toggle i').removeClass('icon-plus');
$('.accordion-toggle i').addClass('icon-minus');
});
我让它在这里工作
$('.expandcollapse').click(function() {
$('.collapse').each(function(index) {
$(this).collapse("toggle");
});
if ($(this).html() == "<i class=\"icon-white icon-plus-sign\"></i> Expand All") {
$(this).html("<i class=\"icon-white icon-minus-sign\"></i> Collapse All");
}
else {
$(this).html("<i class=\"icon-white icon-plus-sign\"></i> Expand All");
};
});
$('.expandcollapse')。单击(函数(){
$('.collapse')。每个(函数(索引){
$(此)。折叠(“切换”);
});
if($(this.html()==“全部展开”){
$(this.html(“全部折叠”);
}
否则{
$(this.html(“全部展开”);
};
});
你能在jsbin/jsfiddle上发布一个提琴吗?haml(?)代码没有多大用处。请发布输出的HTML。这是JSFIDLE。