Jquery 1.9 Checkbox 选中问题
Jquery 1.9版本对CheckBox操作有更新,在我们实际应用中多用 $('#checkbox').attr('checked',true)执行选中操作,但是测试时会发现在部分浏览器(ie10\firefox\chrome)中,只有第一次是能够生效的,之后就没有反应啦,查了一下才知道新版本有替代方法:prop,例如下面全选的例子
<input type="checkbox" class="check-all">全选<br/> <input class="check-one check" type="checkbox" value="1"/>1 <input class="check-one check" type="checkbox" value="2"/>2 <input class="check-one check" type="checkbox" value="3"/>3 <input class="check-one check" type="checkbox" value="4"/>4 <input class="check-one check" type="checkbox" value="5"/>5 <script type="text/javascript"> $(function () { $("input.check-all").click(function () { $("input.check-one").prop("checked", $(this).is(":checked")); }); $("input.check-one").click(function () { var allChecked = true; if ($(this).is(":checked")==false && $("input.check-all").is(":checked")) allChecked = false; else { $("input.check-one").each(function (n, v) { if (!$(v).is(":checked")) { allChecked = false; return false;//break } }); } $("input.check-all").prop("checked", allChecked); }); }); </script>
那么attr和prop具体有什么区别呢:
- 对于HTML元素本身就带有的固有属性,在处理时,使用prop方法。
- 对于HTML元素我们自己自定义的DOM属性,在处理时,使用attr方法。
也就是说W3C标准里包含的属性都建议用prop,其他的才用attr