3

我有一个默认选中=“已选中”的复选框。

但是，如果我取消选中该复选框，然后执行类似的操作

alert($('#checkbox').attr('checked'));

不管有没有勾选，它都会一直提示checked。

我在这里做了这个功能的代码笔。

如何获取复选框的实际选中状态（而不是默认代码中写入的内容）？

4

7 回答 7

7

attr绑定到 DOM 属性，然后保持初始值。如果要检查状态，则必须prop改用：

$('#checkbox').prop('checked')

有关更多信息，您可以阅读 jQuery 文档的“属性与属性”段落prop。

于 2013-04-24T12:52:10.273 回答
4

使用prop()代替，因为：

根据 W3C 表单规范，checked 属性是一个布尔属性，这意味着如果该属性完全存在，则相应的属性为真——例如，即使该属性没有值或设置为空字符串值，甚至“错误的”。所有布尔属性都是如此。

alert($('#checkbox').prop('checked'));

在这里阅读更多

于 2013-04-24T12:52:48.840 回答
3

实际检查的状态存储在checked属性中，所以使用.prop()函数：

$('#checkbox').prop('checked')
于 2013-04-24T12:51:18.887 回答
3

你可以做

alert($('#checkbox').prop('checked'));

你会得到true或false

要获取有关 attr 与 prop 的更多信息，请查看官方prop文档，特别是Attributes vs. Properties部分

根据 W3C 表单规范，checked 属性是一个布尔属性，这意味着如果该属性完全存在，则相应的属性为真——例如，即使该属性没有值或设置为空字符串值，甚至“错误的”。所有布尔属性都是如此。

尽管如此，关于checked 属性最重要的概念是它不对应于checked 属性。该属性实际上对应于 defaultChecked 属性，应该只用于设置复选框的初始值。选中的属性值不会随着复选框的状态而改变，而选中的属性会。因此，确定是否选中复选框的跨浏览器兼容方法是使用该属性：

if ( elem.checked )

if ( $(elem).prop("checked") )

if ( $(elem).is(":checked") )

其他动态属性也是如此，例如 selected 和 value。

于 2013-04-24T12:51:26.273 回答
2

使用 jquery 中的 is 函数来检查，这将给出 true 或 false 

$('#checkbox').is(':checked')

请参阅此修复代码http://codepen.io/anon/pen/mHqAI

于 2013-04-24T12:52:14.430 回答
1

我很想听听有人解释为什么会发生这种情况，但我会告诉你我一直在做什么来解决它

$('#checkbox').get(0).checked

我正在使用本机 dom 对复选框是否被实际选中的解释，只要 #checkbox 存在，它就可以完美地工作

于 2013-04-24T12:51:08.897 回答
1

你可以在没有 jQuery 的情况下做到这一点：

 alert(document.getElementById('checkbox').checked);

密码笔

于 2013-04-24T12:51:48.373 回答