css Twitter Bootstrap折叠式切换所有按钮无法正常工作

tp5buhyn 于 2022-11-27 发布在 Bootstrap

关注(0)|答案(1)|浏览(226)

当我想使用一个按钮来切换所有accordion-element，并且其中一些元素已经打开时，切换功能的行为非常奇怪。
如果我实现这段代码：

$('.corearea-wrapper .corearea-link').click(function(e) {
    e.preventDefault();
    mywrapper = $('.corearea-wrapper #' + $(this).parent().children('.row.fixedcol').attr('id'));
    if(mywrapper.hasClass('allopen')) {
        mywrapper.find('.collapse').collapse('hide');
        mywrapper.find('article').removeClass('active');
        mywrapper.removeClass('allopen');
    } else {
        mywrapper.find('.collapse').collapse('show');
        mywrapper.find('article').addClass('active');
        mywrapper.addClass('allopen');
    }
});

我的预期结果是：第一次单击，关闭所有打开的元素，第二次单击打开所有元素，第三次单击全部关闭，等等。
结果是：第一次点击，打开的元素关闭，BUT关闭的元素打开，第二次点击，打开的元素关闭（所有元素关闭），第三次点击，所有元素打开，第四次点击，所有元素打开，等等。
请在此处观看演示：

http://jsfiddle.net/Lwrhk/的名字

css

来源：https://stackoverflow.com/questions/24065893/twitter-bootstrap-accordion-toggle-all-button-not-working-correctly

1条答案

按热度按时间

y4ekin9u1#

在处理同一个问题时，我发现了你的问题，并玩弄了你的小提琴，通过只对已经展开或折叠的元素采取行动，使它发挥作用：

$('.corearea-wrapper .corearea-link').click(function(e) {
    e.preventDefault();
    mywrapper = $('.corearea-wrapper #' + $(this).parent().children('.row.fixedcol').attr('id'));
    if(mywrapper.hasClass('allopen')) {
        mywrapper.find('.collapse.in').collapse('hide');
        //mywrapper.find('article').removeClass('active');
        mywrapper.removeClass('allopen');
    } else {
        mywrapper.find('.collapse:not(.in)').collapse('show');            
        //mywrapper.find('article').addClass('active');
        mywrapper.addClass('allopen');
    }
});

jfiddle正在这里工作：

http://jsfiddle.net/RobbSadler/Lwrhk/12/的名字

赞(0）回复(0）举报 2022-11-27

我来回答

css Twitter Bootstrap折叠式切换所有按钮无法正常工作

http://jsfiddle.net/Lwrhk/的名字

1条答案

http://jsfiddle.net/RobbSadler/Lwrhk/12/的名字

相关问题

热门标签

最新问答