如何链接到页面并激活该页面上的选项卡内容？

Question

我正在尝试从一个页面直接链接到另一页面上的特定选项卡。我可以访问其他页面，但不知道如何访问特定选项卡。有人做过吗？

在我的 page1.html.haml 上，我有：

.content-box-header
  %li= link_to "tab1", "#tab1", :class => "default-tab"
  %li= link_to "tab2", "#tab2", :class => ""
.content-box-content
  #tab1.tab-content.default-tab
    = render :partial => 'base1_form'
  #tab2.tab-content
    = render :partial => 'base2_form'

如果你点击这个页面上的tab2链接，那么tab2的内容会和tab1的内容重叠。

在我的 page2.html.haml 上，我有：

= link_to "link_me", some_path

此链接显示 page1.html.haml 和 tab1。我怎样才能让这个链接激活#tab2呢？

Answer 1

您可以在page2中page1的url上添加一个额外的参数来激活tab2而不是默认选项卡。

所以在第2页中：

= link_to "link_me", some_path(:tab2 => "")

在page1中，你可以在.content-box-content div之后的底部添加这个

- if params[:tab2]
  :javascript
    jQuery(document).ready(function(){
      jQuery("#tab2_link").click();
    });

另外，在您的链接上添加该 ID

.content-box-header
  %li= link_to "tab1", "#tab1", :class => "default-tab", :id => "tab1_link"
  %li= link_to "tab2", "#tab2", :class => "", :id => "tab2_link"

Answer 2

查看http://www.asual.com/jquery/address/，它在这种深度链接方面做得非常好。