Question

我正在尝试使用jQuery关闭/打开我的单选按钮，但我遇到了一个问题，我的单选按钮错过了点击。我点击它，有时它会更改其检查值，有时不会。实际上我发现在IE中它比Firefox更好（允许我只更改一次）

我使用母版页和单选按钮在我的内容页面上。这是我放在<asp:Content ...>后面的代码。我也使用Bootstrap CSS我的jQuery版本是1.10.2

<script type="text/javascript">
    $(document).ready(function () {
        //set radio button ON
        $("#<%=statusActive.ClientID%>").prop("checked", true); 

            //Assign click event to this specific radio button
            $("#<%=statusActive.ClientID%>").click(function () {

                //Get actual value of checked property and store it into local variable      
                var s = $("#<%=statusActive.ClientID%>").prop("checked");

                //If it was true set it to false and vice versa
                $("#<%=statusActive.ClientID%>").prop("checked", !s);

                //Tell me what value did you set
                $("#<%=txtName.ClientID%>").val(!s);

            });

        });
</script>

我的HTML代码

 $(document).ready(function () {
        $("#MainContent_statusActive").prop("checked", true);

            $("#MainContent_statusActive").click(function () {
                var s = $("#MainContent_statusActive").prop("checked");
                $("#MainContent_statusActive").prop("checked", !s);
                $("#MainContent_txtName").val(!s);
            });
...
<input name="ctl00$MainContent$txtName" type="text" id="MainContent_txtName" class="form-control" />
<span class="radio-inline"><input id="MainContent_statusActive" type="radio" name="ctl00$MainContent$statusActive" value="statusActive" /><label for="MainContent_statusActive">Active</label></span>

你知道什么是不正确的吗？

Answer 1

您正在使用 RadioButton ，例如 CheckBox 。如果要将RadioButton用于 true / false 值，则需要使用两个。否则，我建议您使用 CheckBox 。

<asp:RadioButton ID="ActiveRadioButton" runat="server" GroupName="Status" Text="Active" />        
<asp:RadioButton ID="InactiveRadioButton" runat="server" GroupName="Status" Text="Inactive" />
<asp:CheckBox ID="StatusCheckBox" runat="server" Text="Status" />

<asp:TextBox ID="txtName" runat="server" />

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script type="text/javascript">
    $(function () {
        //set radio button ON
        $("#<%=ActiveRadioButton.ClientID%>").prop("checked", true);                
        $("#<%=ActiveRadioButton.ClientID%>,#<%=InactiveRadioButton.ClientID%>").click(function () {                   

            var active = $('#<%= ActiveRadioButton.ClientID %>').is(":checked");
            var inactive = $('#<%= InactiveRadioButton.ClientID %>').is(":checked");

            console.log("active: " + active + ", inactive: " + inactive);
        });


        $("#<%=StatusCheckBox.ClientID%>").click(function () {

            var value = $('#<%= StatusCheckBox.ClientID %>').is(":checked");
            console.log("checkbox value: " + value);
        });

    });
</script>

ASP.NET中的JQuery和单选按钮。点击不会被注册

1 个答案: