检测复选框状态变化答案

【问题标题】：detect checkbox state change检测复选框状态变化
【发布时间】：2011-10-27 17:12:25
【问题描述】：

我想检测用户是否选中或取消选中 iframe 中的复选框并设置这样的标志。但它似乎没有按预期工作。关于代码错误的任何指针？

jQuery("#frameName").contents().find(":checkbox").bind('change', function(){        
            val = true;
            alert("changed");
    });

但是我可以通过使用来检测复选框是否被选中

var val = jQuery("#frameName").contents().find(":checkbox").is(":checked");

我希望能够检测复选框上的任何状态变化并设置标志。

【问题讨论】：

标签： jquery

【解决方案1】：

使用checked DOM 属性来检查复选框是否被选中。 change 事件总是在更改时触发，即使复选框未被选中。

jQuery("#frameName").contents().find(":checkbox").bind('change', function(){        
        val = this.checked; //<---
        alert("changed");
});

【讨论】：

【解决方案2】：

绑定到点击事件，不改变。复选框在点击时起作用。

编辑：在现代浏览器中，无论是通过鼠标还是键盘更改复选框的状态，都会至少触发 click 和 change 事件。

查看我为证明而构建的jsFiddle demo。除了click和change之外，使用键盘还会触发一些与按键相关的事件。

【讨论】：

除非您的用户正在使用他们的键盘。
@sscirrus 实际上，我们最初都错了 - 使用 IE10、Firefox 20.0.1 和 Chrome 26.0.1410.64，所有浏览器都触发了更改和点击事件。请参阅我的编辑以获取演示链接。
它可能在最新的浏览器中工作，但使用click 的 OP 用户可能会遇到更大的向后兼容性和/或可访问性问题。而click 是一种生成change 的方法，change 最终是我们正在寻找的事件。
同意@sscirrus。当您绑定到change 事件时，您可以通过编程方式选中/取消选中它们，它们将被检测到。
@GregL 如何检测复选框状态中的“程序化更改”？