0

コンテンツを切り替えるための簡単なタブ スクリプトがあります。現在、スクリプトは、クリックされたときにタブのクラスを変更できるようにしますが、タブ本体のコピー内からタブにリンクし、アクティブなタブが選択される適切なクラスを確実に受け取るようにしたいと考えています。

http://jsfiddle.net/jdmcculley/aMBj2/2/

$(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");
}
4

2 に答える 2

0

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-15T17:05:26.220 に答える
0

最も簡単な方法は、これを置き換えることです。

 obj.addClass("selected");

これとともに：

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

jsFiddle の例

于 2013-03-15T17:08:03.387 に答える