Jquery中文网 www.jquerycn.cn
Jquery中文网 >  jQuery  >  jquery 教程  >  正文 关于jQuery中.attr()和.prop()的问题探讨

关于jQuery中.attr()和.prop()的问题探讨

发布时间:2014-03-23   编辑:www.jquerycn.cn
写了几句代码在ie8上能正常运行,chrome和ff却不行,prop()方法适用于Boolean值的属性,添加属性名称该属性就会生效应该使用.prop()者两点就是他们的区别吧
话说写了几句代码在ie8上能正常运行,chrome和ff却不行,朋友说这就是RP啊,郁闷!

其实功能需求是这样的,两个radio:男和女,一个button:重置。启动页面默认选中男,在用户选择女之后又点击重置按钮,需要恢复到默认状态。
复制代码 代码如下:

<input type="radio" id="hRdMale" checked="checked" name="sex" value="male" /><label for="hRdMale">男</label>
<input type="radio" id="hRdFemale" name="sex" value="female" /><label for="hRdFemale">女</label>
<button id="reSet">重置</button>

我的js代码是这样的:
复制代码 代码如下:

$("#reSet").click(function() {
  $("input[name='sex']:first").attr("checked",true);
});

结果就是开头提到的样子,问了几个人都说不清楚,后来查了API后知道在jquery1.6+的版本中添加了.prop()的方法,貌似和.attr()没什么区别,都可以用来获取和设置属性值。后来又了解到.prop()方法适用于Boolean值的属性,官方解释selectedIndex, tagName, nodeName, nodeType, ownerDocument, defaultChecked, 以及defaultSelected 等属性需用.prop()方法。另外,看网上还有好多说“添加属性名称该属性就会生效应该使用.prop()”,本人没验证其他属性,倒是"checked"属性的确是添加就生效。所以,红色的两点应该就是.attr()和.prop()的区别所在了。

所以,将上面click事件方法里面的代码改成下面的就OK了。
复制代码 代码如下:

$("input[name='sex']:first").prop("checked",true);

您可能感兴趣的文章:
关于jQuery中.attr()和.prop()的问题探讨
jquery在项目中做复选框时遇到的一些问题笔记
XML DOM – Attr 对象
解决jquery操作checkbox火狐下第二次无法勾选问题
Jquery attr("checked") 返回checked或undefined 获取选中失效
jQuery学习之prop和attr的区别示例介绍
jquery关于表格及表格列隐藏和显示问题探讨
jquery prop的使用介绍及与attr的区别
jQuery的attr与prop使用介绍
jQuery prop() 方法

关键词: .attr()  .prop()   
[关闭]