1

ラジオ ボタンのように切り替える一連のボタン (A、B、C、D) がありますが、一度に選択できるのは 1 つだけです。ユーザーがボタンを選択した場合、ユーザーは同じボタンをもう一度クリックしてオフにすることもできます。

ボタン (A、B、C、D) と関係がある追加のボタン (X) があります。ボタン X は、ボタン (A、B、C、D) 内の要素が選択されている場合にのみ選択できます。

  1. ユーザーは、ラジオ ボタンのようにボタン (A、B、C、D) を切り替えることができます =これは機能します

  2. ユーザーは、ラジオ ボタンのようなボタン (A、B、C、D) を切り替え、ボタン X を選択してから、ラジオ ボタンのようなボタン (A、B、C、D) を切り替え続けることができ、ボタン X は引き続き強調表示されたままになります。=これは機能します

  3. ボタン (A、B、C、D) のいずれか 1 つをボタン X と一緒に選択できます。 =これは機能します。

私の問題は、ボタン (A、B、C、D) が選択解除されている場合、ボタン X を選択したままにできないことです。再現するにはこちらをご覧ください。 http://jsfiddle.net/froze1906/tHezS/

  1. ボタン X をクリックしようとすると、ボタン (A、B、C、D) のいずれかを選択する必要があります。

  2. ボタン A をクリックすると選択され、ボタン X をクリックすると選択されます。ユーザーはグループから別のボタンを選択するか、ボタン X を元に戻すことができます。

  3. 選択したボタン (A、B、C、D) をオフに切り替えても、ボタン X はまだ選択されています。

ボタン (A、B、C、D) の選択が解除されている場合、ボタン (A、B、C、D) がオフになっているときにマウスアップ時にボタン X の選択も解除されることを確認するには、何を追加する必要がありますか。

4

1 に答える 1

0

デモ: http://jsfiddle.net/tHezS/1/

コードも簡略化しました。

$(".button_toggle").on(mouseup, function(evt){
    // If this is already toggled. Remove this class, and the class of the 'X'
    if($(this).hasClass("button_toggle_selected")){
        $(this).removeClass("button_toggle_selected");
        $(".button_x_icon_toggle").removeClass("button_toggle_selected");
    }else{
        //Remove .button_toggle_selected from other .button_toggle's
        //Add .button_toggle_selected to this element.
        $('.button_toggle.button_toggle_selected').removeClass('button_toggle_selected');
        $(this).addClass('button_toggle_selected');                
    }
});
于 2012-07-18T01:43:44.283 に答える