链接到 rails 中的特定 ajax 选项卡

Question

我有一个问题，我还没有找到答案。

在我的 Rails 4 应用程序中，我使用 ajax 选项卡。下面是代码设置的示例。

显示.html.erb

<div id="ajaxtabs">
  <ul class="nav nav-tabs">
    <li><%= link_to 'Members', some_member_path, :remote => true %></li>
    <li><%= link_to 'Hosts', some_host_path, :remote => true %></li>
  </ul> 
</div>
<div class="tab-content">
  <div id="tab-display"></div>
</div>

会员.js.erb

$("#tab-display").html("<%= escape_javascript (render partial: 'members') %>");

_members.html.erb

 "This is the partial displayed when the members tab is clicked"

一切都运行良好，但我想开始工作的一项功能，那就是链接到特定选项卡的能力。

例如，如果我想链接到成员选项卡，我可以输入网址吗？sitename.com/groups/#members-tab

Answer 1

看起来

你的css类名你正在使用Bootstrap。 如果是这种情况，则可以调用tab函数以在页面加载时更改为右侧选项卡。

假设你有这样的javascript：

<script type="text/javascript">
    $(function() {
      var hash = document.location.hash;
      if (hash) {
        $('.nav-tabs a[href='+hash+']').tab('show');
      }
      $('a[data-toggle="tab"]').on('show.bs.tab', function (e) {
        window.location.hash = e.target.hash;
      });
    });
</script>

这非常简单 - 它从URL中获取参数并期望它与选项卡ID匹配。 请注意，如果页面上有多个可以使用特殊URL的内容，则可能会发生JS错误。

Answer 2

你可以尝试下面这样的东西。

在$("#tab-display").html("<%= escape_javascript (render partial: 'members') %>");正下方members.js.erb中，您需要添加

window.location.href= window.location.href + '#members-tab' #members-tab'

是选项卡名称的值。