1

次のコードがあります。

var selectedMarkerClass = 'was-selected';

$('.group_1').change(function() {
    $(this).addClass(selectedMarkerClass);

    if ($('.' + selectedMarkerClass).length == $('.group_1').length) {
        $('#2').removeClass('red');
    }
});

問題の HTML は次のとおりです。

<input class="single_text_input group_1" type="text" name="primary_referral" />
<input class="single_text_input group_1" type="text" name="secondary_referral" />
<input class="group_1" type="radio" name="referral_open" value="Yes" /> Yes
<input class="group_1" type="radio" name="referral_open" value="No" /> No
<span id="2" class="red">Referral Group</span>

からクラスを削除するには、グループ内の両方のラジオ ボタンを変更する必要がありspanます。グループ内のラジオ ボタンを 1 つだけ変更する必要がある場合に機能させたいと考えています。

4

3 に答える 3

1

clickイベントではなくイベントを使用してくださいchange。

$('.group_1').click(function() {
    $(this).addClass(selectedMarkerClass);

    if ($('.' + selectedMarkerClass).length == $('.group_1').length) {
        $('#2').removeClass('red');
    }
});

アップデート：

if ($('.' + selectedMarkerClass).length == $('.group_1').length)

あなたをつまずかせています。選択したクラスが各ラジオに追加されている場合にのみ赤のクラスを削除します。選択したクラスを追加できるのは、各ラジオをクリックした場合のみです。

より良い方法は次のとおりです。

$('.group_1').click(function() {
    $('#2').removeClass('red');
});

多くの場合、コードが少ないほど良いです。ラジオの選択を解除することはできません。したがって、ラジオをクリックすると、少なくとも 1 つがクリックされることが保証されます。

于 2012-09-12T13:57:12.057 に答える
0

両方のラジオ ボタンが変更された後、ラジオボタン$('.' + selectedMarkerClass).length == 2とinput[type=text] にもクラスを$('.group_1').length == 4使用しているためです。.group_1

ラジオボタンをフィルタリングする必要があります"[name=referral_open]"。

var selectedMarkerClass = 'was-selected';

$('.group_1').change(function () {
    $(this).addClass(selectedMarkerClass);

    if ($('.' + selectedMarkerClass).length == $('.group_1[name=referral_open]').length) {
        $('#2').removeClass('red');
    }
});
于 2012-09-12T14:34:31.993 に答える
0

click代わりにイベントで試してください。change最初のラジオ ボタンがフォーカスを失った後に が発生するため、2 回目のクリック後に変更が行われることがわかります。

于 2012-09-12T13:57:48.653 に答える