javascript - 使用 Javascript 选择其中一项时如何禁用复选框列表中的其他项目

Question

我正在表单中使用复选框列表。 我的复选框列表中有多个选项。 当选中其中一个选项时，应禁用其他选项，以便用户不允许选择其他选项。

我已经在事件处理程序中用 C# 完成了它，但我不能再使用回发 我们如何在 javascript 或 jquery 中做到这一点

    foreach (ListItem li in chk_mycheckbox.Items)
            {

                if ((!(li.Text.ToString().Contains("Unknown"))))
                {
                    li.Enabled = false;

                }

            }

Answer 1

您可能实际上想要一组单选按钮。

例如

<li><input type="radio" name="gender" value="male">Male</li>
<li><input type="radio" name="gender" value="female">Female</li>

因为它只会强制执行一项选择。

但是，在当前场景中，您可以使用以下行循环遍历复选框并禁用任何未选中的复选框。 (这是使用jquery 1.6+)

$('input[type=checkbox]').each(function () {
    if(!$(this).is(':checked')){
        //if not checked
        $(this).prop('disabled', true);
    }
});

根据您的评论。

给出应禁用其他类别的复选框，例如“单选”。那么你的代码可能看起来像这样:

$(document).ready(function() {
    $('#formId input.single-selection').on('click', function (e) {
        var selectedCheckbox = $(this);
        if(selectedCheckbox.is(':checked')){
            $('#formId input[type=checkbox]').each(function () {
                if(selectedCheckbox[0] != $(this)[0]){
                    //if not selected checkbox
                    $(this).prop('disabled', true);
                    $(this).attr('checked', false);
                }
            });
        }else{
            $('#formId input[type=checkbox]').prop('disabled', false);
        }
    });
});

我还没有测试过，但我相信这就是你所需要的。只需将 id 和类替换为您正在使用的内容即可。