1

CSSで作成されたナビゲーションバーを補足する次のjQueryコードがあります。active現在、別のナビゲーションボタンが押されると、コードはクラスを削除します。

activeコードでクラスを削除せず、一度に複数のボタンをアクティブにできるようにしたいと思います。これはどのように達成できますか？

$(function(){
  $(".uibutton").click(function(e){
    e.preventDefault();
    $(".uibutton").addClass("active").not(this).removeClass("active");
  });
});​

jsFiddleの完全なコード：http： //jsfiddle.net/KhyK7/

4

5 に答える 5

2

あなたはtoggleClass削除と一緒に関数を使用することができますremoveClass("active")：

デモ

補足： jQuery UIを使用している場合は、チェックボックスボタンも検討できます。

于 2012-12-22T17:13:05.283 に答える
1

あなたはそのようにあなたのコードを変更することができます

$(function(){
  $(".uibutton").click(function(e){
    e.preventDefault();
    var button = $(this);

    button.toggleClass("active");
  });
});
于 2012-12-22T17:17:29.143 に答える
1

このようにしてください：-

$(function(){
  $(".uibutton").click(function(e){
    $(this).addClass("active");
  });
});​

UIによると、必要なものは間違っています。

ライブデモを参照

于 2012-12-22T17:18:18.570 に答える
1

クリックしたイベントアイテムをターゲットにして、クラスを追加するだけで簡単に...

$(function(){
  $(".uibutton").click(function(e){
    e.preventDefault();
    $(e.target).addClass("active");
  });
});​
于 2012-12-22T17:31:32.977 に答える
0 
$(function(){
    $(".uibutton").click(function(e){
        e.preventDefault();
        if ($(this).hasClass('active')) {
            $(this).removeClass("active");
        } else {
            $(this).addClass('active');
        }
    });
});​
于 2012-12-22T17:22:11.533 に答える