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. 我希望它在只需要更改组中的一个单选按钮的情况下工作。

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');
});

更少的代码通常会更好。您无法取消选择收音机。因此,对收音机的任何点击都会确保至少有一个被点击。

于 2012-09-12T13:57:12.057 回答
0

改用事件试试click。您会在第二次单击后看到更改发生,因为change在第一个单选按钮失去焦点后被触发。

于 2012-09-12T13:57:48.653 回答
0

在两个单选按钮更改之后,$('.' + selectedMarkerClass).length == 2并且$('.group_1').length == 4因为您正在使用.group_1单选按钮以及 input[type=text] 的类。

需要过滤您的单选按钮,使用"[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 回答