更改选项卡选择身体链接点击

我有一个简单的选项卡脚本在内容之间交替。目前，该脚本可以在单击该选项卡类时对其进行更改，但是我希望链接到选项卡正文副本内的选项卡，并确保活动选项卡接收要选择的适当类。更改选项卡选择身体链接点击

$(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

更改选项卡选择身体链接点击

回答

相关问题