Question

这是fiddle。当我在div外面点击时，有什么选项可以关闭子菜单吗？

      <div class="accordion-group">
          <div class="accordion-heading">
               <a class="accordion-toggle" data-toggle="collapse" data-parent="#leftMenu" href="#collapseTwo">
                   <i class="icon-th"></i> Layout
                </a>
          </div>
          <div id="collapseTwo" class="accordion-body collapse" style="height: 0px; ">
               <div class="accordion-inner">
                   <ul>
                      <li>This is one</li>
                      <li>This is two</li>
                      <li>This is Three</li>
                   </ul>
               </div>
           </div>
       </div>

我正在使用bootstrap 3。

Answer 1

如果您看到docs，则可以使用.collapse('hide')方法关闭。

.collapse（ '隐藏'）

隐藏可折叠元素。

更新

在单击文档时，您必须检查单击的元素是否在外面。

$(document).on('click', function (e) {
    // here you can change document to any div id 

    if (!$(e.target).closest('#leftMenu').hasClass('accordion')) { // checking if clicked element is outside `accordion` then only collapse

        $('.in').collapse('hide'); // .in as we need to collapse only the expanded section
    }
});

See Fiddle

在bootstrap 3中的手风琴菜单

1 个答案: