javascript - 如何在 Javascript 中禁用 RadioButtonList 中的某个单选按钮

Question

说到这里，我已经束手无策了。 JavaScript 绝对不是我的强项，我一直在尝试用谷歌搜索解决方案。这是我的代码:

<asp:RadioButtonList ID="Group1Most" onClick="disable('Group1Most', 'Group1Least')" runat="server" >
                            <asp:ListItem Value="1"> |</asp:ListItem>
                            <asp:ListItem Value="2"> |</asp:ListItem>
                            <asp:ListItem Value="3"> |</asp:ListItem>
                            <asp:ListItem Value="4"> |</asp:ListItem>
                        </asp:RadioButtonList>

<asp:RadioButtonList ID="Group1Least" runat="server" >
                            <asp:ListItem Value="1"> This and That</asp:ListItem>
                            <asp:ListItem Value="2"> Fire and Ice</asp:ListItem>
                            <asp:ListItem Value="3"> Black and Tan</asp:ListItem>
                            <asp:ListItem Value="4"> Smith and Wesson</asp:ListItem>
                        </asp:RadioButtonList>

这是 JavaScript:

function disable(index, control)
    {  
        var selected=($("[ID$=_"+index+"] input[type=radio]:checked").val());

        //The rest of the stuff that I can't figure out
    }

我想要做的是，每当您单击 Group1Most RadionButtonList 上的单选按钮时，它将禁用 Group1Least RadioButtonList 上的相应单选按钮。问题是我不知道如何在 RadioButtonList 中选择单个单选按钮。谁能帮帮我？

Answer 1

尝试将此 jQuery 添加到您的页面。您不需要您编写的禁用功能

    <script type="text/javascript" >
         $(document).ready(function() {
             //hook up a click event to all of the inputs in your first group
             $('input[name="Group1Most"]').click(function() {
                 //identify the value from the checked item in the first group 
                 var checkedValue = $('[name="Group1Most"]:checked').val();
                 //identify the item in the second group and disable it.
                 $('input[name="Group1Least"][value=' + checkedValue + ']').attr('disabled', 'disabled');
             });
         });
     </script>

假设值匹配，这将起作用。如果你愿意，你也可以通过索引来完成。

如果您只想一次禁用一个项目并重新启用第二组中先前禁用的项目，请将以下行作为点击函数中的第一行。它将从组中的所有输入中删除禁用属性

     $('input[name="Group1Least"]').removeAttr("disabled")

编辑:

在回答上面@Majid 的评论时，控件的输出是这样的:

    <table id="Group1Most" border="0" onclick="disable('Group1Most', 'Group1Least')" >
     <tbody><tr>
      <td><input id="Group1Most_0" name="Group1Most" value="1" type="radio"><label for="Group1Most_0"> |</label></td>
     </tr><tr>
      <td><input id="Group1Most_1" name="Group1Most" value="2" type="radio"><label for="Group1Most_1"> |</label></td>
     </tr><tr>
      <td><input id="Group1Most_2" name="Group1Most" value="3" type="radio"><label for="Group1Most_2"> |</label></td>
     </tr><tr>
      <td><input id="Group1Most_3" name="Group1Most" value="4" type="radio"><label for="Group1Most_3"> |</label></td>
     </tr>
    </tbody></table>

    <table id="Group1Least" border="0">
     <tbody><tr>
      <td><input id="Group1Least_0" name="Group1Least" value="1" type="radio"><label for="Group1Least_0"> This and That</label></td>
     </tr><tr>
      <td><input id="Group1Least_1" name="Group1Least" value="2" type="radio"><label for="Group1Least_1"> Fire and Ice</label></td>
     </tr><tr>
      <td><input id="Group1Least_2" name="Group1Least" value="3" type="radio"><label for="Group1Least_2"> Black and Tan</label></td>
     </tr><tr>
      <td><input id="Group1Least_3" name="Group1Least" value="4" type="radio"><label for="Group1Least_3"> Smith and Wesson</label></td>
     </tr>
    </tbody></table>