1
$('.button').click(function(){
     $(this).toggleClass('clicked')
     $('.clicked+span').toggleClass('choice');
});

jQueryの学習を始めたばかりで、いくつかのメソッドをいじっていました。そのため、クラスとのリンクを.buttonクリックtoggleClassすると、2 つのクラスが同時に追加されますが、もう一度クリックすると、クラスのみ.clickedが削除されます。.choiceと思っていたにもかかわらず、クラスは残っています。誰かが私がここで見逃していることを説明できますか?これを達成する方法かもしれません-クリックするたびに両方のクラスを切り替えますか?

編集

申し訳ありませんが、これがコードです 。たとえば、「a)」をクリックすると、対応する行が何らかの方法で強調表示されます。

4

4 に答える 4

2

2回目にボタンがクリックされたとき。

$('.clicked+span').toggleClass('choice');

.clickedクラスが削除されたばかりなので、要素が見つかりません。

于 2012-12-07T22:39:55.333 に答える
1

ああ、コードを見るとわかりやすくなります。

    $('.button').click(function(){
        $(this).toggleClass('clicked');
        $(this).next('span').toggleClass('choice');
    });

http://jsfiddle.net/96GZB/3/

スパンを.buttonの子にする方がよいと思うので、スタイルシートにこのようなものを設定するだけで済みます。

.clicked span {
background: blue;
}

次に、.choiceクラスを完全に廃止できます。

于 2012-12-07T23:23:06.230 に答える
1

単一選択の質問を実装しようとしている場合は、次のようなものが必要です。

$('.button').click(function(){
                var $this = $(this),
                    wasClicked = $this.hasClass("clicked");

                //remove another selected if any
                $('.clicked').removeClass('clicked')
                             .next().removeClass('choice');
                //mark current as selected if it wasn't
                !wasClicked && $this.addClass("clicked")
                                    .next().addClass('choice');
            });

http://jsfiddle.net/tarabyte/96GZB/1/

多肢選択式の質問の場合:

$('.button').click(function(){
                $(this).toggleClass('clicked')
                       .next().toggleClass('choice');
            });

http://jsfiddle.net/tarabyte/96GZB/2/

于 2012-12-07T23:19:11.030 に答える
1

一度に 2 つのクラスを追加/削除しようとしている場合は、次のようにします。

$('.button').click(function(){
     $(this).toggleClass('clicked choice');

});

http://jsfiddle.net/cAcJX/

于 2012-12-07T22:44:56.550 に答える