我给一个checkbox调用attr方法,第二个参数是bool类型,它的工作过程是怎样的
一个全选的例子
全选checkbox.click(function(){
选择项集合.attr("checked",这是第二个参数);
//第二个参数,填this.checked 工作正常
//但是我查W3C知道 DOM对象的checked 是bool true,false类型
//第二个参数天$(this).attr("checked")
//把全选按钮的checked属性拿出来,这又不能工作了,我试着alert出来
//alet(this.getAttribute("checked"));全部为空值,就是说我点一个checkbox,
//并没有改变它的checked属性
})
所以我的问题是jq在attr(string,bool)类型时怎么处理的,我试着用vs debug,方法调用太多,看不懂..
全部代码如下,来个前端的帮我看看呗...
1 <!DOCTYPE html> 2 <html xmlns="http://www.w3.org/1999/xhtml"> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 5 <title></title> 6 <script src="Scripts/jquery-1.7.1.js"></script> 7 <script> 8 $(function () { 9 //获取所有的子checkbox 10 var $subCkecks = $(":checkbox:gt(0)"); 11 12 $(":checkbox:first").click(function () { 13 //alert(this.getAttribute("checked")); 14 ////this是事件源 15 //attr总是为空 16 17 //点全选 选项跟着变 18 19 //W3C checked bool 类型 20 $subCkecks.attr("checked",this.checked); 21 }) 22 23 $(":button").click(function () { 24 $subCkecks.each(function () { 25 //this指向数组中每一项 26 this.checked = !this.checked; 27 }); 28 }); 29 30 //test checkbox的checked属性是 31 //true,flase 32 //checked 33 34 //结果为false 35 //alert(document.getElementById("testcheck").getAttribute("checked")); 36 }) 37 </script> 38 </head> 39 <body> 40 <input type="checkbox" />全选 41 <input type="button" value="反选" /><br /> 42 43 <input type="checkbox" value="吃饭" id="testcheck"/>吃饭<br /> 44 <input type="checkbox" value="睡觉" />睡觉<br /> 45 <input type="checkbox" value="打豆豆" />打豆豆<br /> 46 </body> 47 </html>
checkbox.checked = b 不会影响DOM元素的结构(也就是不会修改、添加、删除attribute),所以修改(或者通过点击复选框改变)了checkbox.checked值之后,checkbox.getAttribute('checked')得到的还是原值。 但反之不亦然,checkbox.setAttribute('checked', x)会影响 checkbox.checked。 W3C着实没少干各种2B事。
至于 $.attr 方法, 它几乎是简单的调用 setAttribute/getAttribute 而已, 最多只是把你给的值进行了 value = value ? 'checked' : null 的归一操作而已。
考虑使用 $.prop 吧, 这个情况下 $.prop 更合适
非常感谢,我咋没想到三元运算符呢,还没用过prop,查查文档去
我是在看黑马dotnet二期那个视频自学...
总结一下checkbox
取checked用$(selector).attr("selected ")得到的就可以用作bool类型
设置用$(selector).attr("selected",true or false)
用DOM的checked属性设置,还有getAttribute获取,有不同步的情况,例如勾上checkbox,getAttribute取到的是空