Javascript RadioButton onclick事件未触发

我有一组

单选按钮

，应该有一个

onclick

事件。此

onclick

事件（

SecurityCheckedChanged

）将根据单击的

RadioButton

显示/隐藏其他分隔符（用

RadioButton填充）

但是，
SecurityCheckedChanged
似乎不起作用。当涉及到
RadioButton
时，我不确定是否对
onclick
事件有什么误解。或者如果此
.is（':checked'）
不正确

JavaScript:

//this seems to fire off fine
function pageLoad(sender, args) {
    $('#divRadioGroupKeyFormatWEP').hide();
    $('#divRadioGroupKeyFormatWPA').hide();
}

//however this doesn't seem to work.
function SecurityCheckedChanged() {
    if ($("#<%= radWEP.ClientID %>").is(':checked')) {
        $('#divRadioGroupKeyFormatWEP').show();
        $('#divRadioGroupKeyFormatWPA').hide();
    }
    else if ($("#<%= radWPA.ClientID %>").is(':checked') || $("#<%= radWPA2.ClientID %>").is(':checked')) {
        $('#divRadioGroupKeyFormatWEP').hide();
        $('#divRadioGroupKeyFormatWPA').show();
    }
    else {
        $('#divRadioGroupKeyFormatWEP').hide();
        $('#divRadioGroupKeyFormatWPA').hide();
    }
}

//这似乎很好
函数页面加载（发送方，参数）{
$（'#divRadioGroupKeyFormatWEP'）.hide（）；
$（'#divRadioGroupKeyFormatWPA'）.hide（）；
}
//然而，这似乎不起作用。
函数SecurityCheckedChanged（）{
如果（$（“#”）是（':checked'））{
$（'#divRadioGroupKeyFormatWEP'）.show（）；
$（'#divRadioGroupKeyFormatWPA'）.hide（）；
}
如果（$（“#”）是（':checked'）||$（“#”）是（':checked'））{
$（'#divRadioGroupKeyFormatWEP'）.hide（）；
$（'#divRadioGroupKeyFormatWPA'）.show（）；
}
否则{
$（'#divRadioGroupKeyFormatWEP'）.hide（）；
$（'#divRadioGroupKeyFormatWPA'）.hide（）；
}
}

HTML:

看来你缺少括号了。在我看来，它应该是：onclick=“SecurityCheckedChanged（）”或onclick=“javascript:SecurityCheckedChanged（）”

问题的第一个答案是关于如何在javascript中钩住事件的有趣问题。
我喜欢使用RadioButtonList，使用jQuery选择器很容易找到所选的值-

#id输入：收音机：已选中

<div style="text-align: left;">
    <asp:RadioButtonList runat="server" ID="SecurityRadioButtonList" 
        RepeatDirection="Horizontal">
        <asp:ListItem Text="None" Value="" Selected="True" />
        <asp:ListItem Text="WEP" Value="WEP" />
        <asp:ListItem Text="WPA" Value="WPA" />
        <asp:ListItem Text="WPA2" Value="WPA2" />
    </asp:RadioButtonList>
</div>
<!-- show/hide these based on above -->
<div id="divRadioGroupKeyFormatWEP" style="text-align: left;">
    <asp:RadioButton ID="radOpen" Text="Open" Checked="True"
        GroupName="RadioGroupKeyFormat1" runat="server" />
    <asp:RadioButton ID="radShared" Text="Shared" Checked="False"
        GroupName="RadioGroupKeyFormat1" runat="server" />
</div>

<div id="divRadioGroupKeyFormatWPA" style="text-align: left;">
    <asp:RadioButton ID="radTKIP" Text="TKIP" Checked="True"
        GroupName="RadioGroupKeyFormat2" runat="server" />
    <asp:RadioButton ID="radAES" Text="AES" Checked="False"
        GroupName="RadioGroupKeyFormat2" runat="server" />
</div>



.
浏览器控制台中是否有任何错误？这是一个客户端问题，发布浏览器看到的标记总是有帮助的。$（“#”）在JS中混合.NET变量是一种不好的做法。它确保了JS文件永远不会被缓存。此外，您最好选择可以控制的类名，而不是.NET使用元素ID的疯狂行为。
<div style="text-align: left;">
    <asp:RadioButtonList runat="server" ID="SecurityRadioButtonList" 
        RepeatDirection="Horizontal">
        <asp:ListItem Text="None" Value="" Selected="True" />
        <asp:ListItem Text="WEP" Value="WEP" />
        <asp:ListItem Text="WPA" Value="WPA" />
        <asp:ListItem Text="WPA2" Value="WPA2" />
    </asp:RadioButtonList>
</div>
<!-- show/hide these based on above -->
<div id="divRadioGroupKeyFormatWEP" style="text-align: left;">
    <asp:RadioButton ID="radOpen" Text="Open" Checked="True"
        GroupName="RadioGroupKeyFormat1" runat="server" />
    <asp:RadioButton ID="radShared" Text="Shared" Checked="False"
        GroupName="RadioGroupKeyFormat1" runat="server" />
</div>

<div id="divRadioGroupKeyFormatWPA" style="text-align: left;">
    <asp:RadioButton ID="radTKIP" Text="TKIP" Checked="True"
        GroupName="RadioGroupKeyFormat2" runat="server" />
    <asp:RadioButton ID="radAES" Text="AES" Checked="False"
        GroupName="RadioGroupKeyFormat2" runat="server" />
</div>

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript">    
    var wepDiv, wpaDiv;    
    $(function() {
        wepDiv = $('#divRadioGroupKeyFormatWEP');
        wpaDiv = $('#divRadioGroupKeyFormatWPA');
        wepDiv.hide();
        wpaDiv.hide();    
        $('#<%= SecurityRadioButtonList.ClientID %> input').click(function() {
            securityChange();
        });    
        securityChange();
    });

    function securityChange() {
        var value = $('#<%= SecurityRadioButtonList.ClientID %> input:radio:checked').val();
        if (value != undefined) {
            if (value == "WEP") {
                wepDiv.show();
                wpaDiv.hide();
            } else if (value == "WPA" || value == "WPA2") {
                wepDiv.hide();
                wpaDiv.show();
            } else {
                wepDiv.hide();
                wpaDiv.hide();
            }
        }
    }
</script>