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

Вам нужен метод выбора вкладок

* 1005 например *

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

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

});

Демо с использованием вашей разметки здесь

Answer 2

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

Answer 3

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

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

в этом коде указывает на вкладку 1. Вы можете использовать # tabs-2 или # tabs-3. какую вкладку вы хотите открыть.

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

Если ссылки будут обычным явлением, можно использовать следующий дизайн:

<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>