Jquery1.6版本后attr的变化,灰常委屈

 基于上次发表的 Jquery 获取checkbox的checked问题,从大家的评论中得到了答案,原因是Jquery1.6版本后 attr 给改了,悲剧的我不知道,给耍了半天。

认真地去看了官方的最新文档,当中有这样的一段话 = =!

可见,给YIN了吧。下面发个改动后的效果:
jquery1.6+版本:

 

下文来自www.jquery.com The difference between attributes and properties can be important in specific situations. Before jQuery 1.6, the .attr() method sometimes took property values into account when retrieving some attributes, which could cause inconsistent behavior. As of jQuery 1.6, the .prop() method provides a way to explicitly retrieve property values, while .attr() retrieves attributes For example, selectedIndextagNamenodeNamenodeTypeownerDocument,defaultChecked, and defaultSelected should be retrieved and set with the .prop() method. Prior to jQuery 1.6, these properties were retrievable with the.attr() method, but this was not within the scope of attr. These do not have corresponding attributes and are only properties.

elem.checked true (Boolean) Will change with checkbox state
$(elem).prop("checked") true (Boolean) Will change with checkbox state
elem.getAttribute("checked") "checked" (String) Initial state of the checkbox; does not change
$(elem).attr("checked")(1.6) "checked" (String) Initial state of the checkbox; does not change
$(elem).attr("checked")(1.6.1+) "checked" (String) Will change with checkbox state
$(elem).attr("checked")(pre-1.6) true (Boolean) Changed with checkbox state

 

 

 

//勾选后输出:
//attr('checked'): checked
//.prop('checked'): true
//.is(':checked'): true

 //取消勾选输出:

//.attr('checked'): undefined
//.prop('checked'): false
//.is(':checked'): false




jquery1.4 版本:

复制代码
 1 <!DOCTYPE html> 
 2 <html> 
 3 <head> 
 4 <style> 
 5 p { margin: 20px 0 0 } 
 6 b { color: blue; } 
 7 </style> 
 8 <script src="../js/jquery-1.4.4.js"></script> 
 9 </head> 
10 <body> 
11    
12 <input id="check1" type="checkbox" checked="checked"> 
13 <label for="check1">Check me</label> 
14 <p></p> 
15  
16 <script> 
17 $("input").change(function() { 
18   var $input = $(this); 
19   $("p").html(".attr('checked'): <b>" + $input.attr('checked') + "</b><br>" 
20               + ".is(':checked'): <b>" + $input.is(':checked') ) + "</b>"; 
21 }).change(); 
22 </script> 
23  
24 </body> 
25 </html>
复制代码

 

勾选后输出:
//attr('checked'): true
//.prop('checked')  1.6后版本才有这个方法
//.is(':checked'): true

 取消勾选输出:

 

//.attr('checked'): false
//.prop('checked')1.6后版本才有这个方法
//.is(':checked'): false


 



结论: attr('checked'): 在1.6后版本,所获取的值是 "checked"/"underfined"  ,之前所获得的值是"false"/"true"。截然不同

 

长知识了

原博地址:http://www.cnblogs.com/-run/archive/2011/11/16/2251569.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值