jQuery Tabs - get tabtemplate of selected tab

I have 3 tabs. Tab1 is selected by default. If I click Tab2; I want to get the previous selected tab.

I tried:

开发者_StackOverflow中文版var previousTab;

jQuery(function () {
    jQuery("#tabs").tabs({
            select: function (event, ui){
            doSomething(previousTab);
            previousTab = jQuery(ui.tab);
            },
            create: function (event, ui) {
            previousTab = jQuery(ui.tab);
        }
    });
});

This doesn't work. Can anyone tell me the solution for this?

Thanks in Advance.

---

The reason is that, at create, ui is an empty object. If you know first tab is selected at start, you can simply assign the previous tab variable to the first tab at create.

One suggestion: instead of creating a global variable to keep track of the previous tab, you can store it in the #tabs element. It is generally a good practice to avoid creating variables in the global scope.

$('#tabs').tabs({
    select: function(event, ui) {
        var previousTab = $(this).data('previousTab');
        if (previousTab !== undefined)
            console.log(previousTab);
        $(this).data('previousTab', $(ui.tab));
    },
    create: function(event, ui) {
        $(this).data('previousTab', $($(this).find('ul > li > a').get(0)));
    }
});

See it in action: http://jsfiddle.net/william/yMbhA/2/.

---

I solved it using show function. previousTab is a variable in global scope.

jQuery(function () {
    jQuery("#tabs").tabs({
        select: function (event, ui) {
            previousTab = jQuery(ui.tab);
        },
        show: function (event, ui) {
            previousTab = jQuery(ui.tab);
        }
    });
});