javascript - 如何在javascript中更改列表框的选择模式

Question

我有一个处于多选模式的列表框，但在特定的单选按钮上单击我想将其更改为单选模式。请帮帮我

  <tr>
                                    <td style="text-align: right; vertical-align: top; width: 21%;">
                                        <asp:Label ID="Label4" runat="server" Text="Do ypu want to apply NET/SET/PH.D. rule" ></asp:Label>
                                    </td>
                                    <td align="left" style="vertical-align: top;">
                                        :
                                    </td>
                                    <td align="left">
                                        <asp:RadioButtonList ID="RB_applyRule" runat="server" RepeatDirection="Horizontal" 
                                               onclick="radioButtonClick();"
                                            onselectedindexchanged="RadioButtonList1_SelectedIndexChanged" >
                                                <asp:ListItem Text="Yes   &#160;&#160;&#160;&#160;&#160;&#160;" Value="0" Selected="True" ></asp:ListItem>
                                                <asp:ListItem Text="No" Value="1" ></asp:ListItem>
                                            </asp:RadioButtonList>
                                        &nbsp; <font class="Mandatory">*</font>
                                    </td>
                                </tr>
                                <tr>
                                    <td style="text-align: right; vertical-align: top; width: 21%;">
                                        <asp:Label ID="lblDesignation" runat="server" Text="Seniority for designation" meta:resourcekey="lblDesignationResource1"></asp:Label>
                                    </td>
                                    <td align="left" style="vertical-align: top;">
                                        :
                                    </td>
                                    <td align="left">
                                        <asp:ListBox ID="List_Designation" runat="server" Width="306px" SelectionMode="Multiple"
                                            Rows="1"></asp:ListBox>
                                        &nbsp; <font class="Mandatory">*</font>
                                    </td>
                                </tr>
                                <tr>

//JavaScript

    function radioButtonClick() {
        var rbList = document.getElementById('<%=RB_applyRule.ClientID%>');
        var rbCount = rbList.getElementsByTagName("input");
        var targRB;
        for (var i = 0; i < rbCount.length; i++) {
            if (rbCount[i].checked == true) {
                // var labelArray = rbCount[i].parentNode.getElementsByTagName('label');
                // targlist = targlist + labelArray[0].innerHTML + ", ";     // Get Label of Radiobutton
                targRB = rbCount[i].value;
             //   alert(targRB);
            }
        }
        if (targRB == "0") {
            alert("Yes");
        }
        if (targRB == "1") {
            alert("No");
        }
    }

//当警报说"is"时，意味着我选择"is"，指定 id List_Designation 将在选择模式下更改。

Answer 1

您可以使用jquery-ui-multiselect-widget插件。 IMO 这正是您正在寻找的。如果您想将模式更改为单选模式，可以在此处设置 multiple: false。

$("select").multiselect({
   multiple: false,
   header: "Select an option",
   noneSelectedText: "Select an Option",
   selectedList: 1
});

查看演示和代码here 。如果您不想使用该插件，只需检查其代码即可了解其逻辑，希望对您有所帮助。