使用jquery激活頁面加載標籤

Question

如何激活頁面加載中我的網頁的第一個標籤頁？
我做的標籤使用jquery和ul標籤。

&點擊單個選項卡後，它們應該處於活動狀態。

HTML代碼：

<div id="sociallink"> 
    <ul> 
     <li><a href="javascript:void(0);" class="tab1"><img class="sa_image" src="images/facebook.png" border="0" /></a></li> 
     <li><a href="javascript:void(0);" class="tab2" ><img class="sa_image" src="images/tweeter.png" border="0" /></a></li> 
     <li><a href="javascript:void(0);" class="tab3" ><img class="sa_image" src="images/message.png" border="0" /></a></li> 
     <li><a href="javascript:void(0);" class="tab4" ><img class="sa_image" src="images/persnal.png" border="0" /></a></li> 
    </ul> 
</div> 

jQuery代碼：

$(document).ready(function() { 

    $('#sociallink ul li:first').addClass('active'); 

    $('#sociallink ul li a').click(function(){ 
     var currentTab = $(this).attr('href'); 
     return false; 
    }); 
}); 

運行此代碼不激活第一個選項卡以及其它他們沒有得到激活點擊。

請幫忙。

Answer 1

您應該在點擊的標籤之間切換「活動」類。見下圖：

$('#sociallink ul li a').click(function(){ 
    $(this).parent('li').siblings('li.active').removeClass('active'); 
    $(this).parent('li').addClass('active'); 
    var currentTab = $(this).attr('class'); 
    return false; 
}); 

也最好是屬性class='tabx'分配給它的父li

Answer 2

你有第一個選項卡激活時，你需要調用裏的點擊添加活動類，然後清除活性從別人：

假設這是你的活動標籤CSS類：

.active a{ 
    border:solid 1px red; 
} 

然後使用這個腳本：

$(document).ready(function() {   
    $('#sociallink ul li:first').addClass('active'); 

    $('#sociallink ul li a').click(function(){ 
     $(this).parent().siblings().removeClass('active'); 
     $(this).parent().addClass('active'); 
     return false; 
    }); 
}); 

需要您的css類.active{}才能看到這將如何影響活動選項卡。

甚至你可以試試這個：

$('#sociallink ul li').click(function(){ 
     $(this).siblings().removeClass('active'); 
     $(this).addClass('active'); 
     return false; 
    });