设置多选框为单选-CSDN博客

两种复选框设置单选框的方法，1，直接绑定asp控件点击事件，2，设置html input控件

asp复选框控件设置单选框：

         <asp:CheckBoxList ID="CredentialId" runat="server" RepeatDirection="Horizontal" CssClass="input">
             <asp:ListItem Value="0" Text="外贸提单" οnclick="CheckBoxList_Click(this)"></asp:ListItem>
             <asp:ListItem Value="1" Text="外贸合同" οnclick="CheckBoxList_Click(this)"></asp:ListItem>
             <asp:ListItem Value="2" Text="报关单" οnclick="CheckBoxList_Click(this)"></asp:ListItem>
             <asp:ListItem Value="3" Text="其他" οnclick="CheckBoxList_Click(this)"></asp:ListItem>
         </asp:CheckBoxList>


 // 设置服务端控件多选框只能单选
        function CheckBoxList_Click(sender) {
            var container = sender.parentNode;
            if (container.tagName.toUpperCase() == "TD") { // 服务器控件设置呈现为 table 布局（默认设置），否则使用流布局 
                container = container.parentNode.parentNode; // 层次： <table><tr><td><input /> 
            }
            var chkList = container.getElementsByTagName("input");
            var senderState = sender.checked;
            for (var i = 0; i < chkList.length; i++) {
                chkList[i].checked = false;
            }
            sender.checked = senderState;
        }

html复选框设置单选框：

            // 设置单选框
            $("input:checkbox").click(function () {
                var boxArray = document.getElementsByName(this.name);
                for (var i = 0; i <= boxArray.length - 1; i++) {
                    if (boxArray[i] == this && this.checked) {
                        boxArray[i].checked = true;
                    } else {
                        boxArray[i].checked = false;
                    }
                }
            });