CODEWITHSUNDEEP
jquerytabsselected
Patrioticcow
Patrioticcow

Reputation: 27038

jQuery how to set first tab active?

 $( '#xxx' ).tabs({
select: function(event, ui) { 
var theSelectedTab2 = ui.index;

if (theSelectedTab2  == 0) {
$('ul li.ep_s1').removeClass('ep_s1').addClass('ep_s-click1');
if ($('ul li#h13').hasClass('ep_l-click1')) {
   $('ul li#h13').removeClass('ep_l-click1').addClass('ep_l1');
}}
else if (theSelectedTab2  == 1 ) {
$('ul li.ep_l1').removeClass('ep_l1').addClass('ep_l-click1');
if ($('ul li#h12').hasClass('ep_sidebar_friends-click1')) {
   $('ul li#h12').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.

basically i want when the page loads the if (theSelectedTab2 == 0) statement and everything that happens inside it to be active.

thanks

Upvotes: 4

Views: 17448

Answers (4)

Phuc Nguyen Minh
Phuc Nguyen Minh

Reputation: 382

that's what I'd do

$(function () {
    $("ul.nav-tabs li:first").addClass("active");
    $(".tab-content .tab-pane:first").addClass("active");
});

Upvotes: 0

Pablo S G Pacheco
Pablo S G Pacheco

Reputation: 2600

I had to do like this to make it work:

jQuery( "#xxx" ).tabs({active: 1});
jQuery( "#xxx" ).tabs("option", "active", 0);

Doing this way trigger the events soon enough

Upvotes: 1

GeReV
GeReV

Reputation: 3265

Perhaps the following line, after the tabs initialize:

$( '#xxx' ).tabs('select', 0);

Hopefully, it will also trigger the event you want.

Upvotes: 5

Nikolay Yordanov
Nikolay Yordanov

Reputation: 1404

Trigger a click event on the first tab after page load?

Like $('first tab selector').click()

Upvotes: 1

Related Questions