Jquery 获取checkbox的checked问题
这个郁闷了,今天写这个功能的时候发现了问题,上网找了好多资料对照,更加纠结。。。
事实证明一切,自己测试了N遍,发现网上的说法和自己以前的理解都是错的,不知道大家有没发现.
下面来看看网上大多资料的说法
转别人的一些东西:
在html的checkbox里,选中的话会有属性checked="checked"。
如果用一个checkbox被选中,alert这个checkbox的属性"checked"的值alert($(#xxx).attr("checked")),会打印出"true",而不是"checked"!
如果没被选中,打印出的是"undefined"。
注意红色的部分,这里说到
$("#chekbox").sttr("checked")//should be print "true" , not "checked"
经过测试,证明上面说法有问题
<script type="text/javascript"> $(function() { $("#button").click(function() { alert($("#checkbox").attr("checked")); }); }); </script> <input type="checkbox" name="checkbox" id="checkbox"><input type="button" id="button" value="Click Me">
//上面得出的结果是: 如果勾上checkbox,会打印出 “checked” , 如果取消打勾 会打印出 "undefined"
实验证明Jquery获取checked的值得打印出"true"是错误的
举一反三:
而且发现Jquery获取已经被勾上的checkbox,永远都是"checked" 这让人费解,如果有人知道为什么,可以告诉我一下,哈~~
<script type="text/javascript"> $(function() { $("#button").click(function() { alert($("#checkbox").attr("checked")); }); }); </script> <input type="checkbox" name="checkbox" id="checkbox" checked><input type="button" id="button" value="Click Me">
//注意红色位置,如果默认checkbox为checked状态,测试会发现,
把勾去掉也是只会输出"checked" , 表示不理解为什么
Jquery会这样
解决方法,还是用document.get获取吧:
<script> function getcheckbox(){ var test = document.getElementById("checkbox").checked; alert(test); } </script> <input type="checkbox" name="checkbox" id="checkbox"><input type="button" id="button" value="Click Me" onclick="getcheckbox()">
//选中为"true",取消选中为"false"
如果有错,希望指正。网上搜索的问题都是一个帖子转N遍,自己测试证明一下
多谢大家的帮助,终于知道了原因,原来是Jquery版本的问题 jquery.1.6之后的版本,就出现这样的问题。果然是知识跟不上更新的速度!!
相关推荐
当在事件处理函数中使用 jQuery 的 `.attr()` 获取 `checked` 属性时,返回的值可能并不准确。这是因为 `.attr()` 只能获取元素的初始静态属性值,而不是实时状态。如果想获取复选框的实际状态,应使用 `.prop()` ...
本篇文章将详细探讨如何使用jQuery有效地更改checkbox的状态,以及`attr()`和`prop()`这两个函数之间的关键区别。 当遇到checkbox状态无法正确更新的情况,通常是因为没有正确地使用`prop()`方法。在jQuery中,`...
在jQuery中,`attr()`和`prop()`方法都可以用来设置或获取元素的属性,但它们在处理某些属性时,如`checked`,可能会有微妙的区别。`attr()`主要用于设置HTML属性,而`prop()`则更适用于处理DOM元素的特性。 在描述...
在本文中,我们将深入探讨使用jQuery来判断复选框(checkbox)是否被选中,以及如何改变复选框的状态。复选框作为一种常用的表单元素,广泛应用于多选一或多选多的场景中。利用jQuery提供的方法,可以非常简便地对复...
总结来说,当遇到`checkbox.attr("checked")`返回`undefined`的问题时,应该使用`checkbox.prop("checked")`来获取或设置复选框的实时状态。这在实现全选、反选等涉及复选框状态同步的场景中尤为重要。记住这个技巧...
在jQuery的早期版本中,`attr`方法常用于设置或获取HTML元素的属性,包括checkbox的选中状态。然而,自jQuery 1.6引入`prop`方法以来,推荐使用`prop`来处理某些特定的属性,特别是那些代表元素状态或行为的属性,如...
但在某些情况下,特别是对于`checkbox`的`checked`属性,`attr()`并不总是准确地反映元素的实际状态。因此,当使用`attr()`来改变`checked`属性时,可能不会更新元素的实际选中状态,导致第二次点击全选按钮时无法...
在这个场景中,`$(this).attr("checked")`总是返回`undefined`,因为`checked`属性并不适用于`<input type="button">`。 正确的使用`checked`属性的方式是: 1. 对于`<input type="checkbox">`,你可以这样设置: ...
当我们尝试使用`$(selector).attr("checked")`来获取Checkbox是否被选中的状态时,这个方法并不总是准确。一旦Checkbox被选中过一次,无论之后用户是否取消选择,`.attr("checked")`始终会返回`"checked"`字符串,...
`attr()` 方法在jQuery 1.6之前通常用于获取和设置元素的属性(attributes)。属性是HTML元素标签中定义的,如`<input type="checkbox" id="myCheckbox" checked>`中的`checked`。然而,`attr()`并不总是反映元素的...
$("input[type='checkbox']").eq(0).prop("checked", false); } ``` 此函数同样接收一个参数 `datagridId`,它将取消选定的行以及取消“全选”复选框的选择。 ##### 2.4 关闭弹出窗口 在使用 `jQuery EasyUI` 的弹...
需要注意的是,这段代码中的`$(‘input[type=checkbox][value=true]’)[0]`和`[1]`可能不总是可靠的,因为这些选择器会匹配所有type为`checkbox`且value为`true`的元素,而不仅仅是当前需要修改的复选框。...
例如,`<input type="checkbox" checked>`,当我们使用`attr("checked")`时,会返回`"checked"`这个字符串。 然而,`prop`方法则用于处理元素的属性(properties),这些属性反映了元素的当前状态,比如`checked`、...
但当涉及到DOM节点的固有属性时,例如`checkbox`的`checked`属性,使用`$(el).prop(name, val)`更为合适,因为`prop`方法专门用于读写这些属性,而`attr`则同时适用于固有属性和自定义属性,但某些特殊固有属性仅能...
然而,这并不总是准确的,因为`checked`不是一个简单的值,而是一个布尔特性。当`checked`属性存在时,无论其值是什么,复选框都会被标记为选中。如果`checked`属性不存在,复选框则会被认为未选中。 相反,`prop()...
需要注意的是,data()方法获取的属性值是缓存的,也就是说,jQuery会存储这些值,因此多次调用data()方法来获取同一个属性值时,其性能会优于反复使用attr()方法。 在性能对比方面,通常prop()方法的性能最优,其次...