更改選項卡選擇身體鏈接點擊

我有一個簡單的選項卡腳本在內容之間交替。目前，該腳本可以在單擊該選項卡類時對其進行更改，但是我希望鏈接到選項卡正文副本內的選項卡，並確保活動選項卡接收要選擇的適當類。更改選項卡選擇身體鏈接點擊

$(document).ready(function() { 

    $('.tabs a').click(function(){ 
     switch_tabs($(this)); 
    }); 

    switch_tabs($('.defaulttab')); 

    $('.tab-content .img-frame a').click(function(){ 
     switch_tabs($(this)); 
    }); 

}); 

function switch_tabs(obj) 
{ 
    $('.tab-content').hide(); 
    $('.tabs a').removeClass("selected"); 
    var id = obj.attr("rel"); 

    $('#'+id).show(); 
    obj.addClass("selected"); 
}

來源

2013-03-15 jimu_nimja

什麼是「正確」的課？在我的回答中，我從舊標籤中刪除'selected'類並將其添加到新標籤。在更改標籤時是否還有其他類需要交換？ – j08691 2013-03-15 17:25:11

CSS

.selected { 
    background-color: #387C2B !important; 
    border: 1px solid #006633 !important; 
}

的Javascript

$('.tabs a').click(function(){ 
    switch_tabs($(this)); 
}); 

switch_tabs($('.defaulttab')); 

$('.tab-content .img-frame a').click(function(){ 
    switch_tabs($(this)); 
}); 


function switch_tabs(obj) 
{ 
    $('.tab-content').hide(); 
    $('.tabs a').removeClass("green").removeClass("selected").addClass("gray"); 
    var id = obj.attr("rel"); 

    $('#'+id).show(); 
    obj.addClass("selected").removeClass("gray"); 
}

工作實例：http://jsfiddle.net/aMBj2/4/

來源

2013-03-15 17:05:26

如果您單擊Overview div中的Chicago鏈接，則這兩個選項卡都會變灰。 – tymeJV 2013-03-15 17:10:59

非常感謝凱文，因此確實刪除了選定的班級，但仍然存在一些我無法弄清楚的問題。我如何設置「芝加哥」選項卡進行選擇。此外，當點擊「概覽」標籤正文中的芝加哥鏈接時，它會變成綠色。有什麼想法嗎？ – 2013-03-15 17:13:30

最簡單的方法是，以取代本：

obj.addClass("selected");

與此：

$('a[rel='+id+']').addClass("selected");

jsFiddle example

來源

2013-03-15 17:08:03 j08691

更改選項卡選擇身體鏈接點擊

回答

相關問題