How to get current tab title which i named in Jquery Tabs UI

Question

I'm using http://jqueryui.com/demos/tabs/#manipulation. I want to get an title of current selected tab which I earlier named (e.g. from a href). How to get it?

I tried: $(ui.tab).attr('href')

Answer 1

From the jquery docs,

var selectedTabTitle = null;
$( ".selector" ).tabs({
   select: function(event, ui) {
            selectedTabTitle = $(ui.tab).text();
            alert(selectedTabTitle);
    }
});

Answer 2

Alternative way to get tab title:

var selected = $("#tabs").tabs( "option", "selected" );
var selectedTabTitle = $($("#tabs li")[selected]).text();

Answer 3

Use following in case of jQuery 1.9+,

var currentTabTitle = $('div[id="mytabs"] ul .ui-tabs-active > a').attr("href");

Answer 4

Just another version:

$("#tabsId .ui-state-active > a").html()

Answer 5

i guess jquery was modified because now i was able to fetch tab name using:

$(function () {
 $( "#tabs" ).tabs({
    activate : function (event,ui) {
        selectedTabTitle = ui.newTab[0].innerText;
        alert(selectedTabTitle);
    }
});
});

Answer 6

Thanks I was struggling with this code.

Now I've used thiscode in my program. Working like this.

$('#tabs').click('tabsselect', function (event, ui) {
    var selectedTab = $("#tabs").tabs('option','selected');
    alert("selectedTab===>" +  $($("#tabs li")[selectedTab]).text());
});