jquery – 如何在bootstrap手风琴中添加加减号

我使用的是一个自举手风琴,第一个面板总是打开,面板打开了.我正在检查我的jquery代码,看看该类是否包含类突出显示该锚点.但目前所有锚点都突出显示.

我只是希望第一个锚点突出显示是打开的,休息关闭面板应该有一些不同的风格.

这是小提琴：Fiddle

如您所见,所有锚标记都会突出显示.我想要第一个锚来获得一些不同的造型.整个想法是为手风琴添加加/减符号.

解决方法

尝试 collapse的show事件 – bootstrap 3

jQuery(function ($) {
    var $active = $('#accordion .panel-collapse.in').prev().addClass('active');
    $active.find('a').prepend('<i class="glyphicon glyphicon-minus"></i>');
    $('#accordion .panel-heading').not($active).find('a').prepend('<i class="glyphicon glyphicon-plus"></i>');
    $('#accordion').on('show.bs.collapse',function (e) {
        $('#accordion .panel-heading.active').removeClass('active').find('.glyphicon').toggleClass('glyphicon-plus glyphicon-minus');
        $(e.target).prev().addClass('active').find('.glyphicon').toggleClass('glyphicon-plus glyphicon-minus');
    })
});

然后

.panel-heading.active {
    background-color: green;
}

演示：Fiddle

在你的代码中

$(document).ready(function () {
    if ($('div').filter(':not(in)')) {
        $('.panel-title a').addClass('active');
    }
});

filter()方法返回一个jQuery对象,因此它总是很简单,你也可以将类添加到标题中的所有锚元素,无论它是否处于活动状态,当你更改手风琴时你也不会改变它