将第一个复选框设置为选中，其他复选框从客户端的复选框列表中禁用

set first check box checked and others disable from checkbox list in clientside

本文关键字：复选框 客户端 列表 设置 第一个 其他      更新时间：2023-09-26

我有一个复选框列表。在加载页面时，我希望我的第一个复选框为true，而其他复选框则被禁用。我只需要从复选框列表中选中一个复选框，其他复选框都应该被禁用。如果使用未选中复选框，则应启用其他复选框意味着只允许选中一个复选框。

我的javascript代码在这里，但在加载页面时，它没有选中第一个复选框，而且我想要在使用checkboxlist时每个复选框的id。

function CheckOptions(CheckBoxList) {
         var checkboxlist = document.getElementById('CheckBoxList1');
            var checkedCount = 0;
            var options = CheckBoxList.getElementsByTagName('input');                
            for (var i = 0; i < options.length; i++) {
                if (options[i].checked) {                       
                    checkedCount += 1;
                }
            }
            if (checkedCount > 0) {
                for (var j = 0; j < options.length; j++) {
                    if (!options[j].checked)
                        options[j].disabled = true;
                }                }
           else {
                for (var k = 0; k < options.length; k++) {
                    options[k].disabled = false;
                }
            }
    }

如果你一次只想检查一个，听起来一组单选按钮会更好地满足你的目的。

$(function() {
    var checkboxes = $("input[type=checkbox]");
    // select the first one on load
    checkboxes.eq(0).attr("checked", "checked");
    checkboxes.each(function(i, e) {
        if (i > 0) {
            $(e).attr("disabled", "disabled");
        }
    })
    // handle further selections:
    checkboxes.click(function() {
        if ($(this).attr("checked")) {
            var t = this;
            checkboxes.each(function(i, e) {
                if (e != t) {
                    $(e).attr("disabled", "disabled");
                }
            });
        } else {
            checkboxes.attr("disabled", null)
        }
    });
});
相关文章：