With jQuery UI tabs, you can use the select method to run code when a tab is clicked:
$( ".selector" ).tabs({
select: function(event, ui) { ... }
});
But the code is run before the just clicked tab has been loaded. I need to run code after new tab has been loaded. How can I do this? Thanks for reading.
click(function () { // bind click event to link $tabs. tabs('select', 4); // switch to tab return false; });
var selectedTab = $("#TabList"). tabs(). data("selected. tabs");
removeClass('ep_s-click1'). addClass('ep_s1'); }} } }); if i use selected: 0 it will set up the first tab as active but it will now go through the if (theSelectedTab2 == 0) statement and go through adding those classes. if after the page loads i click on those tabs the script works perfect.
API HAS CHANGED. This event is now "activate"/"tasbactivate"; see http://api.jqueryui.com/tabs/#event-activate
----- OLD Answer below -----------
Based on the question it's the tabsshow (not the tabsload) event that is desired...event is triggered when a tab is shown.
Code examples: ( from http://jqueryui.com/demos/tabs/ )
Supply a callback function to handle the show event as an init option.
$( ".selector" ).tabs({
show: function(event, ui) { ... }
});
Bind to the show event by type: tabsshow.
$( ".selector" ).bind( "tabsshow", function(event, ui) {
...
});
The event is useful if you want to set focus on control or similar.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With