快捷導(dǎo)航

關(guān)于jQuery中.attr()和.prop()的問題探討

更新時(shí)間：2013年09月06日 18:00:16 作者：

寫了幾句代碼在ie8上能正常運(yùn)行，chrome和ff卻不行，prop()方法適用于Boolean值的屬性，添加屬性名稱該屬性就會(huì)生效應(yīng)該使用.prop()者兩點(diǎn)就是他們的區(qū)別吧

話說寫了幾句代碼在ie8上能正常運(yùn)行，chrome和ff卻不行，朋友說這就是RP啊，郁悶！

其實(shí)功能需求是這樣的，兩個(gè)radio：男和女，一個(gè)button：重置。啟動(dòng)頁面默認(rèn)選中男，在用戶選擇女之后又點(diǎn)擊重置按鈕，需要恢復(fù)到默認(rèn)狀態(tài)。

復(fù)制代碼代碼如下:

 
<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代碼是這樣的：

復(fù)制代碼代碼如下:

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

結(jié)果就是開頭提到的樣子，問了幾個(gè)人都說不清楚，后來查了API后知道在jQuery1.6+的版本中添加了.prop()的方法，貌似和.attr()沒什么區(qū)別，都可以用來獲取和設(shè)置屬性值。后來又了解到.prop()方法適用于Boolean值的屬性，官方解釋selectedIndex, tagName, nodeName, nodeType, ownerDocument, defaultChecked, 以及defaultSelected 等屬性需用.prop()方法。另外，看網(wǎng)上還有好多說“添加屬性名稱該屬性就會(huì)生效應(yīng)該使用.prop()”，本人沒驗(yàn)證其他屬性，倒是"checked"屬性的確是添加就生效。所以，紅色的兩點(diǎn)應(yīng)該就是.attr()和.prop()的區(qū)別所在了。

所以，將上面click事件方法里面的代碼改成下面的就OK了。

復(fù)制代碼代碼如下:

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

您可能感興趣的文章:

相關(guān)文章

應(yīng)項(xiàng)目要求，需要在頁面加載完畢之后獲取圖片的高度，本例使用jquery來完成這個(gè)功能，需要的朋友可以參考下
2014-06-06

關(guān)于jQuery中的end()使用方法

最近在學(xué)習(xí)jQuery方面的知識，學(xué)習(xí)中遇到一定的困難，一些知識不得不查看官方的文檔，在用到end()方法時(shí)，被一個(gè)小例子搞得有點(diǎn)暈。

2011-07-07

JS中Array數(shù)組學(xué)習(xí)總結(jié)

本文主要介紹了JS中Array數(shù)組的相關(guān)知識。具有一定的參考價(jià)值，下面跟著小編一起來看下吧

2017-01-01

利用Jquery實(shí)現(xiàn)幾款漂亮實(shí)用的時(shí)間軸(附示例代碼)

這篇文章主要介紹了利用Jquery實(shí)現(xiàn)幾款漂亮的時(shí)間軸示例代碼，文中利用Jquery實(shí)現(xiàn)了縱向折疊時(shí)間軸、縱向鼠標(biāo)滑動(dòng)時(shí)間軸、縱向可折疊時(shí)間軸以及橫向時(shí)間軸，每種時(shí)間軸都給出了完整的示例代碼，需要的朋友可以參考學(xué)習(xí)。

2017-02-02