首页 > 代码库 > jquery checkbox 全选 不要用attr要用 prop
jquery checkbox 全选 不要用attr要用 prop
最近的项目要用到checkbox全选功能,然而使用 attr时总是出现第二次点击时checkbox不变化。后来搜索后,发现在jquery1.6以后已经不用attr处理布尔值的属性了。
查看文档发现
properties就是浏览器用来记录当前值的东西。正常情况下,properties反映它们相应的attributes(如果存在的话)。但这并不是boolean attriubutes的情况。当用户点击一个checkbox元素或选中一个select元素的一个option时,boolean properties保持最新。但相应的boolean attributes是不一样的,正如上面所述,它们仅被浏览器用来保存初始值。
$(‘#task_endless_table‘).on(‘click‘, ‘#checkAll‘, function() { // $(‘input[name="subBox2"]‘).attr("checked",this.checked); $(‘input[name="subBox"]‘).prop(‘checked‘, this.checked); });
另外:jquery的on函数又是一个新功能,对于我的项目,on功能可以帮助我解决“刷新后重新绑定的问题”
下面是 jquery checkbox 全选demo
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head runat="server"><title>jQuery实现CheckBox全选、全不选</title><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /><script src="http://lib.sinaapp.com/js/jquery/1.7.2/jquery.min.js" type="text/javascript"></script> <script type="text/javascript"> $(function() { $("#checkAll").click(function() { $(‘input[name="subBox"]‘).prop(‘checked‘, this.checked); }); }); </script> </head><body> <div> <input id="checkAll" type="checkbox" />全选 <input name="subBox" type="checkbox" />项1 <input name="subBox" type="checkbox" />项2 <input name="subBox" type="checkbox" />项3 <input name="subBox" type="checkbox" />项4 </div></body></html>
jquery checkbox 全选 不要用attr要用 prop
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。