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

i am using a checkbox list in a form. i have multiple options in the checkbox list. When one of the option is checked then other options should be disabled so that users should not be allowed to select other options.

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

i have done it in c# in the eventhandler but i cannot use postback anymore how can we do this in javascript or jquery

我已经在事件处理程序中用c#完成了但是我不能再使用postback如何在javascript或jquery中执行此操作

    foreach (ListItem li in chk_mycheckbox.Items)
            {

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

                }

            }

6 个解决方案

#1

Might you actually want a set of radio buttons instead.

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

e.g.

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

As it will enforce only one selection.

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

However, in your current scenario you could use the following lines to loop over the checkboxes and disable any that are not selected. (this is using jquery 1.6+)

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

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

Following on from your comment.

继续你的评论。

Give the tick boxes that should disable the others an extra class e.g. "single-selection". Then your code can look something like this:

给出应该禁用其他类别的复选框,例如“单项选择”。然后你的代码看起来像这样:

$(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);
        }
    });
});

I've not tested it, but I believe this is what you need. Just replace the ids and classes with what you're using.

我没有测试过,但我相信这就是你需要的。只需用您正在使用的内容替换ID和类。

6 个解决方案

#1

更多相关文章

随机推荐