如何通过复选框启用无线电组？

Question

我做了搜索,但我仍然无法解决它.请帮忙:

这是我的js代码:

<script type="text/javascript">
    $(document).ready(function() {
        $("#email_acc").click(function() {
            if ( $(this).is(":checked") ) {
                $("#email_group").attr("enabled","enabled");
            }
        });  

        $("#system_acc").click(function() {
            if ( $(this).is(":checked") ) {
                $("#system_group").attr("enabled","enabled");
            }
        }); 
    });
</script>

以下是我的html代码:

<input type="checkbox" name="email_acc" id="email_acc" />Email Account
<input type="checkbox" name="sys_acc" id="sys_acc" />System Account

<input type="radio" name="radio_email" value="create" class="email_group" id="radio_email_0" disabled="disabled"/>New
<input type="radio" name="radio_email" value="change" id="radio_email_1" disabled="disabled"/>Change
<input type="radio" name="radio_email" value="terminate" id="radio_email_2" disabled="disabled"\ />Termination

<input type="radio" name="radio_system" value="create" class="system_group" id="radio_system_0" disabled="disabled"/>New
<input type="radio" name="radio_system" value="change" id="radio_system_1" disabled="disabled" />Change
<input type="radio" name="radio_system" value="terminate" id="radio_system_2" disabled="disabled" />Termination

我不知道是什么问题.它只是不起作用.

Answer 1

没有"enabled"属性或属性，只有"disabled"可以设置false为启用相关元素的属性或属性。（“属性”位于您的源 html 中，但对“属性”进行了动态更改，将其设置为布尔值以禁用或不禁用。）

除非使用旧版本的 jQuery，否则应该使用该.prop()方法来更新此属性。要启用整组单选按钮，您必须按其属性选择所有单选按钮name（或给它们一个公共项class并按其选择）。

$("#email_acc").click(function() { 
    if ( this.checked ) {  
        $('input[name="radio_email"]').prop('disabled', false);
    }
});

// and the same for the other checkbox and group.

请注意，您的第二个复选框有一个id="sys_acc"，但您的 JS 正在尝试选择"#system_acc"- 您需要确保它们匹配。

如果您需要在未选中该复选框的情况下再次禁用该组，则可以执行以下操作，删除该if语句并将disabled属性设置为该checked属性的倒数：

$('#email_acc').click(function() { 
    $('input[name="radio_email"]').prop('disabled', !this.checked);
});

// and again the same idea for the other checkbox and group.

演示： http: //jsfiddle.net/UqTB3/

请注意，在这两种情况下，我都使用this.checked而不是$(this).is(":checked")：我发现前者更容易阅读，并且checked直接检查 DOM 元素的属性比创建 jQuery 对象并使用更有效.is(":checked")。但如果您真的热衷于使用 jQuery 来完成所有事情，您可以进行适当的替换。