Jquery Tab 从选项卡内的内容链接到另一个选项卡

Question

我正在使用 JQuery 选项卡插件。

我想链接选项卡 1 中的内容以将我带到选项卡 3，而不必单击选项卡 3 才能访问它。我该怎么做？

@redsquare...所以，我根据你的建议修改了它，这样我就可以让所有选项卡彼此交互。这个改变有效，再次感谢，所以我想我想知道是否有更好的写法或者这是最好的方法？

最新更改的演示：http://jsbin.com/etoku3/

<script type="text/javascript"> 
    $(document).ready(function() {
        var $tabs = $("#container-1").tabs();
          $('a.tab1').click(function(){$tabs.tabs('select', 0);});
          $('a.tab2').click(function(){$tabs.tabs('select', 1);});
          $('a.tab3').click(function(){$tabs.tabs('select', 2);});
          $('a.tab4').click(function(){$tabs.tabs('select', 3);});
          $('a.tab5').click(function(){$tabs.tabs('select', 4);});
    });
</script>

Answer 1

您需要 选项卡选择方法

例如

$('#anchor').click( function(){

  $('#tabs').tabs( "select" , 2 )

});

使用您的标记的演示 此处

Answer 2

$('#tabs').tabs({ selected: "#tabs-1" });

Answer 3

如果链接经常出现，可以使用以下设计：

<script lang="text/javascript">
$('.tablink').live( 'click', function(){
  $('#container-1').tabs('select', $(this).attr('rel'));
});
</script>

并在正文中包含以下链接：

<span class="tablink" rel="2">Link to tab 2</span>

或

<a href="" class="tablink" rel="2">Link to tab 2</a>

Answer 4

语义解决方案：

$(document).ready(function() {
$('a.directTab').click( function(){
    var tabWanted = $(this).attr('rel').split('-')[1];
    $('#container-1').tabs( "select" , tabWanted);
    });
});

如果您对“click”单独事件有问题，可以使用“live”。

对于链接，您可以用所需的选项卡替换“rel”属性：

<a class="directTab" rel="fragment-3">want this text</a> to link to tab 3 

否则请尝试以下干扰性代码：

<a onclick="$('#container-1').tabs('select', 2);">want this text</a> to link to tab 3 

Answer 5

$("#your button or what uou want to clivk").live('click',function()
    {

         $('#tabs').tabs({ selected: "#tabs-1" });
    });

在此代码中，它指向选项卡 1。您可以使用 #tabs-2 或 #tabs-3。您要打开哪个选项卡。