0

リンクをクリックしてタブ付きライトボックスを表示できるように、「tabify」プラグインと組み合わせて fancybox プラグインを使用しています。そこに問題はありませんが、特定のタブでアクティブ状態をアクティブにし、他のタブからアクティブ状態を削除するリンクをクリックできるようにしたいと考えています。

ここにjqueryがあります：

$("a.timesheet-active").click(function() {
        if ($('li').hasClass('active')) {
        $('li.active').addClass('inactive').removeClass('active');
        }
        if ($('li').hasClass('inactive')) {
        $('li.inactive').removeClass('inactive').addClass('active');
    }
});


<ul id="menu">
    <li class="active"><a id="aa-pp" href="#reserve-pp"></a></li>
    <li class="inactive"><a id="aa-ts" href="#reserve-timesheets"></a></li>
</ul>

ここでの目標は、a.timesheet-active がクリックされ、li.active が li.inactive に変わり、li.inactive が li.active に変わるときです。

どんな助けでも大歓迎です！

4

1 に答える 1

1 
$("a.timesheet-active").on('click', function(e) {
    e.preventDefault();
    $('li.active, li.inactive').toggleClass('inactive active');
});

それが<a>要素である場合、通常はデフォルトのアクションを防ぐ必要があります。その後、両方の要素の両方のクラスを切り替えて、それらを切り替えるだけです。

フィドル

于 2012-08-13T18:07:05.127 に答える