重定向时自动选择选项卡

Question

我在rails网站上运行ruby，它目前支持javascript和jquery。我正在使用htmlslim，scss和bootstrap。

我想知道如果有可能有一个按钮或链接发送用户到另一个页面，然后自动点击该页面上的选项卡。

比如我有一个网页下面编译的HTML：

... 
<div class="row"> 
    <ul class="nav nav-tabs profile-tabs" id="userTabs"> 
    <li class="active" id="userItems" role="presentation"> 
     <a data-toggle="tab" href="#items" role="tab"> 
     <span class="key">Items</span> 
     <span class="value">13</span> 
     </a> 
    </li> 
    <li role="presentation"> 
     <a class="stand-card-activate" data-toggle="tab" href="#people" role="tab"> 
     <span class="key">People</span> 
     <span class="value">3</span> 
     </a> 
    </li> 
    </ul> 
</div> 
... 

这是2个选项卡行和项目选项卡是在默认情况下，当用户访问的页面中选择的选项卡。

有什么方法可以制作一个按钮，可以链接到此页面并自动选择人员选项卡？

这里是渺茫相同的代码：

... 
    .row 
    ul#userTabs.nav.nav-tabs.profile-tabs 
     li#userItems.active[role="presentation"] 
     a(href="#items" role="tab" data-toggle="tab") 
      span.key Items 
      span.value = @user.items.count 
     li(role="presentation") 
     a.stand-card-activate(href="#people" role="tab" data-toggle="tab") 
      span.key people 
      span.value = @people_count 
    ... 

编辑2： 到目前为止的代码：

苗条：

a.back-to-user-people-btn.pull-left(href=www.yourpage.com/#people) Back to People 

JS：

var hash= window.location.hash; 
    if(hash.length > 0) { 
    $('a[role="tab"]').parent().removeClass('active');//remove the default active tab 
    $('a[href="'+hash+'"]').parent().addClass('active'); 
    } 

这jquery al低于它有正确的选项卡名称突出显示和“活动”，但项目选项卡的内容仍然是用户看到的内容。

编辑3：显示选项卡的内容纤薄代码

.tab-content 
    #items.tab-pane.fade.active.in.col-md-12(arialabelledby="items" role="tabpanel") 
     .card-container = render partial: 'partials/item', collection: @user[:items], as: :user_item, locals: {user: @user} 

    #people.tab-pane.fade.active.in.col-md-12(arialabelledby="people" role="tabpanel") 

Answer 1

尝试是这样的

的链接应该是这样的：www.yourpage.com/#tabhrefid

当页面加载它将采取来自URL的哈希值并将活动类添加到标签女巫与同一链接相同href

$(function(){ 
     var hash= window.location.hash; 
      if(hash.length > 0) { 
       $('a[role="tab"]').parent().removeClass('active');//remove the default active tab 
       $('a[href="'+hash+'"]').parent().addClass('active'); 
       $('.tab-pane').removeClass('active'); 
       $(hash).addClass('active'); 
      } 
    });