首页 文章

bootstrap框架 - 至少有一个手风琴（又名折叠）项目随时打开

提问于
浏览 次
5

我在我的网站上使用Bootstrap，只是在某些页面内容中添加了手风琴折叠 .

它工作正常，但我想保留 at least one panel open at all times .

目前，面板始终切换打开/关闭，请参见下面的示例：

http://twitter.github.com/bootstrap/javascript.html#collapse

有人找到了解决方法吗？

以下是Boostrap站点的代码，它类似于我当前的实现（使用数据属性初始化它）：

<div class="accordion" id="accordion2">
  <div class="accordion-group">
    <div class="accordion-heading">
      <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapseOne">
        Collapsible Group Item #1
      </a>
    </div>
    <div id="collapseOne" class="accordion-body collapse in">
      <div class="accordion-inner">
        Anim pariatur cliche...
      </div>
    </div>
  </div>
  <div class="accordion-group">
    <div class="accordion-heading">
      <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapseTwo">
        Collapsible Group Item #2
      </a>
    </div>
    <div id="collapseTwo" class="accordion-body collapse">
      <div class="accordion-inner">
        Anim pariatur cliche...
      </div>
    </div>
  </div>
jquery twitter-bootstrap accordion collapse

3 回答

  • 1

    http://jsfiddle.net/SMT9D/61/

    $('.accordion-toggle').on('click',function(e){
    if($(this).parents('.accordion-group').children('.accordion-body').hasClass('in')){
        e.preventDefault();
        e.stopPropagation();
    }
});

    你应该添加 e.preventDefault(); to prevent the default behaviour of # HTML anchor if you have a scroll in your page

    回复于
  • 0

    当有人点击活动组时，你必须阻止Bootstrap做任何事情 .

    在bootstrap-collapse.js中搜索处理此问题的函数 .

    你有没看过http://twitter.github.com/bootstrap/javascript.html#collapse>用法>选项？

    回复于
  • 2

    这个问题的解决方案：How do you make Twitter Bootstrap Accordion keep one group open?

    感谢@ aron.lakatos指出另一个已解决的问题 . 虽然问题是相同的，但在这个问题后几周问了解问题:)

    回复于

相关问题