Class 事件处理程序未检测复选框是否被选中

Question

我想做的就是通过 class 绑定一些复选框的更改事件 - 然后确定复选框是被选中还是未选中以进行进一步处理（与我当前的问题无关）。

"nope" 警报弹出，无论如何 - 我不知道为什么。我已经阅读了几个相关主题，我发布的代码似乎对其他人有用。

HTML:

        <asp:CheckBox ID="cbNewMembers" runat="server" Checked="true" Text="New Members" CssClass="GreenControl CheckOption" />
        <asp:CheckBox ID="cbLostMembers" runat="server" Checked="false" Text="Lost Members" CssClass="GreenControl CheckOption" />
        <asp:CheckBox ID="cbIncludeOnline" runat="server" Checked="false" Text="Include Online Apps" CssClass="GreenControl CheckOption" />

jQuery:

$(document).ready(function (e) {
    $(".CheckOption").on("change", function () {
        if ($(this).is(":checked"))
            alert("yep");
        else
            alert("nope");
    });
});

请注意，我也尝试过：

if (this.checked)

和

if ($(this).prop("checked") == "checked")

和其他一些组合。但是，正如我所说，if 语句的计算结果始终为 false。请帮忙！

更新：

我将事件处理程序更改为：

    $(".CheckOption input[type='checkbox']").on("change", function (e) {
        if ($(this).is(":checked"))
            alert("yep");
        else
            alert("nope");
    });

Answer 1

ASP.NET 复选框未呈现为 HTML 中的简单复选框。

<asp:CheckBox ID="oi" CssClass="test"  runat="server"/>

打印为：

<span class="test"><input id="MainContent_oi" type="checkbox" name="ctl00$MainContent$oi"></span>

所以你最终将事件处理程序附加到 span 而不是 input，你的处理程序仍然被触发，因为更改事件被传播到 input 父级。

要在事件处理程序中获取输入，请添加事件参数并将 this 更改为 evt.target:

$(document).ready(function (e) {
    $(".CheckOption").on("change", function (evt) {
        if ($(evt.target).is(":checked"))
            alert("yep");
        else
            alert("nope");
    });
});

Class 事件处理程序未检测复选框是否被选中

Class event handler not detecting whether or not checkbox is checked

.net

javascript

checkbox

jquery