Question

我正在尝试使用4个链接的侧边栏将底部链接包含为可折叠链接。即，当底部链接处于活动状态时，它下面应该有两个额外的“子链接”。当用户点击返回前3个链接中的任何一个时，底部（第4个）链接应该折叠＆amp; 不显示上述2个子链接。

非常感谢任何有关如何使其正常工作的帮助。

我的代码如下：

<li><a href="#">Current State</a></li>
<li><a href="#">Issues</a></li>
<li><a href="#">Requests</a></li>
<li class="panel-group <%= 'active' if current_page?project_settings_path(project) %>" id="accordion">
  <%= link_to 'Settings', project_settings_path(project) %>

  <div id="demo" class="collapse in">
   <%= link_to 'general', some_path_a(project) %> # this page should be active after the user clicks on the 'Settings' list item link above
   <%= link_to 'invites', some_path_b(project) %>
  </div>

  <script>
   $("#demo").collapse({"toggle": true, 'parent': '.panel-group'});
  </script>

</li>

APPLICATION.JS FILE

// This is a manifest file that'll be compiled into application.js, which will include all the files
// listed below.
//
// Any JavaScript/Coffee file within this directory, lib/assets/javascripts, vendor/assets/javascripts,
// or vendor/assets/javascripts of plugins, if any, can be referenced here using a relative path.
//
// It's not advisable to add code directly here, but if you do, it'll appear at the bottom of the
// compiled file.
//
// Read Sprockets README (https://github.com/sstephenson/sprockets#sprockets-directives) for details
// about supported directives.
//
//= require jquery
//= require jquery_ujs
//= require bootstrap
//= require turbolinks
//= require_tree .

Answer 1

好的，所以我放弃了自举倒塌的东西。 javascript，只是在第4个列表项上做了一个基本的rails'if'语句（在我上面提到的'demo'div）...看起来像这样：

<% if current_page?(project_settings_path(project)) || current_page?(project_invites_path(project)) %> 
  <div id="demo" class="collapse in pull-right">
   <ul>
     <li style="margin: 10px 0px;">
       <%= link_to 'General Settings', project_settings_path(project) %>
     </li>

     <li>
      <%= link_to 'Add Collaborators', project_invites_path(project) %>
     </li>

    </ul>
   </div>
<% end %>

不确定它是否是最佳方式，但它可以满足需要。

折叠切换不适用于Twitter Bootstrap手风琴

1 个答案: