How to insert javascript after displaying jQuery ui tab?

Question

I want to run the JavaScript function on my page, but only when the tab is displayed.

There are actually two questions. I don't use ajax tabs, so would I put my JavaScript in the "load" or "show" callback if I want the code to run only after the tab is displayed?

Depending on the answer above, what would my code look like to do the following:

I want it to be like this

• when displaying / loading tabs
• → paste javascript here.
• when tab2 is displayed / loaded
• → insert different javascript here.
• when tab3 is displayed / loaded
• → insert different javascript here.
• and etc.

Answer 1

:

$('#foo').tabs({
    show: function(event, ui) {
        if(ui.index == 0)
        {
         //tab 1 is clicked
        }
        else if(ui.index == 1)
        {
         //tab 2 is clicked
        }
        else if(ui.index == 2)
        {
         //tab 3 is clicked
        }
    }
});

else ifs:)
: onShow show, jQuery.