加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 综合聚焦 > 资源网站 > 资源 > 正文

javascript – Bootstrap Accordion展开/折叠全部无法正常运行

发布时间:2020-12-14 22:38:58 所属栏目:资源 来源:网络整理
导读:这是打破这个的过程: 单击音乐符号 单击“展开/全部折叠” 单击音乐符号 单击“展开/全部折叠” 再次单击“展开/折叠全部” 请注意,音乐符号不会打开备份,即使您应该能够在函数中看到逻辑表明所有面板都已关闭且应该打开.为什么?我究竟做错了什么? HTML:

这是打破这个的过程:

>单击音乐符号
>单击“展开/全部折叠”
>单击音乐符号
>单击“展开/全部折叠”
>再次单击“展开/折叠全部”

请注意,音乐符号不会打开备份,即使您应该能够在函数中看到逻辑表明所有面板都已关闭且应该打开.为什么?我究竟做错了什么?

HTML:

最佳答案
问题在于所有面板的状态与任何单个面板的状态不同,因为手风琴与数据父对象一起工作的方式.你的展开/折叠所有按钮处理程序需要完全覆盖正常的手风琴行为.

展开/折叠所有单击处理程序必须跟踪最后一个状态(全部展开或全部折叠),因为Bootstrap Collapse组件单独处理每个单独面板的状态(一次只打开一个).否则,将无法知道是打开还是关闭单独的切换面板.

$('#expandAllFormats').on('click',function () {

   if ($(this).data("lastState") === null || $(this).data("lastState") === 0) {

        // close all
        $('.collapse.in').collapse('hide');

        // next state will be open all
        $(this).data("lastState",1);
        $(this).text("Expand All");

    }
    else {

        // initial state...
        // override accordion behavior and open all
        $('.panel-collapse').removeData('bs.collapse')
        .collapse({parent:false,toggle:false})
        .collapse('show')
        .removeData('bs.collapse')
         // restore single panel behavior
        .collapse({parent:'#accordionFormat',toggle:false});

        // next state will be close all
        $(this).data("lastState",0);
        $(this).text("Collapse All");
    }

});

http://www.codeply.com/go/76Hl6s49rb

OFC,另一种方法是简单地删除data-parent =属性并完全禁用手风琴行为.

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读