Bootstrap4：使用按钮显示/隐藏 Div

Question

我在 Rails 上使用 Bootstrap4 在不使用 JS 的情况下制作可折叠菜单。每个菜单项都应该展开其 div 并折叠其他菜单项。但是，我无法做到这一点。有没有一种方法可以在单击一个按钮时折叠所有其他 div？

%button.btn.dropdown-toggle{"aria-expanded" => "false", "aria-haspopup" => "true", "data-toggle" => "dropdown", :type => "button"}
  All Stuff
  .dropdown-menu
    %a.dropdown-item{"aria-controls" => "collapseFree", "aria-expanded" => "false", "data-toggle" => "collapse", :href => "#collapseFree"}
      Free Stuff
    %a.dropdown-item{"aria-controls" => "collapseNew", "aria-expanded" => "false", "data-toggle" => "collapse", :href => "#collapseNew"}
      New Stuff
#collapseFree.collapse 
  ..
#collapseNew.collapse
  ..

Answer 1

如果没有 js，这不会发生。您可以使用隐藏的复选框在单击时显示和隐藏一个菜单，但不会关闭其他菜单。在 css 中，目前不可能有父选择器，而这是需要的。

Bootstrap4：使用按钮显示/隐藏 Div

Bootstrap4: Show / Hide Divs with Button

ruby-on-rails-4

bootstrap-4