Идентификатор выбранной вкладки?

Question

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

http://jsfiddle.net/oshirowanen/eWncA/

Можно ли вместо этого получить идентификатор, если у пользователя были идентификаторы. Если проще получить его из другого места, то это также будет хорошо, то есть связанные теги div или где-то еще.

Answer 1

jQuery UI просто добавляет класс к выбранному li.Вы можете просто извлечь li с выбранным классом следующим образом:

   var id = $("li.tab.ui-tabs-selected").attr("id");

Если вы хотите получить одну из невыбранных вкладок, вы можете сделать что-то вроде этого:пример:

http://jsfiddle.net/UBs9m/2/

Answer 2

var id = $("li.tab:eq("+selected+")").attr('id');

Answer 3

Если вы можете просто использовать обработчик событий select элемента управления Tabs, это прекрасно работает:

$('#tabs').tabs({
    select: function( evt, ui ) {
        console.log( $(ui.panel).attr( 'id' ) );
    }
});

Кроме того, вот удобная ссылка для различных ui свойств объекта.

Answer 4

Если вы используете вкладки jquery (новая версия):

<div id="tabs">
        <ul>
            <li data-value="tab1"><a href="#tab1">Name of tab1</a></li>
            <li data-value="tab2"><a href="#tab2">Name of tab2</a></li>
        </ul>
        <div id="tab1">
        </div>
        <div id="tab2">
        </div>
 </div>       

 //get id in init
 $(function () {
    $("#tabs").tabs({
        activate: function(event ,ui) {
           var id = $(ui.newPanel).prop('id');
        }
      }
    );
 });
 var id = $("#tabs li.ui-state-active").attr('data-value'); //get id in other function

Answer 5

Если вы заходите сюда через Google, как и я, и используете jQuery UI 1.9.X, используйте события activate или beforeActivate, чтобы получить id:

$('selector').tabs({
  activate: function(e, ui) {
    var id = $(ui.newPanel).prop('id');
  }
});

Документация