性福宝在线播放亚洲av_精品国产一区二区三区AVl_青青成人一区在线视频_亚洲AV永久无码动漫精心天堂_国产白嫩挺拔在线精品

好運(yùn)物流網(wǎng)-全國領(lǐng)先的物流網(wǎng)   好運(yùn)物流網(wǎng)-登錄  好運(yùn)物流網(wǎng)-免費(fèi)注冊 進(jìn)入我的后臺 首頁 | 發(fā)布信息 | 服務(wù)項目 | 物流百科
物流查詢|物流公司|中國物流信息網(wǎng)-好運(yùn)物流網(wǎng)
 
你正在查看的信息:資訊首頁->資訊頻道->IT編程技術(shù)->正文

jQuery中attr和prop方法的區(qū)別,checkbox的使用總結(jié),判斷是否選中

更新時間:2022/4/23 16:56    出處:互聯(lián)網(wǎng)
已經(jīng)瀏覽
4809

方法一:

1 if ($("#checkbox-id").get(0).checked) {
2     // do something
3 }

方法二:

1 if($('#checkbox-id').is(':checked')) {
2     // do something
3 }

方法三:

1 if ($('#checkbox-id').attr('checked')) {
2     // do something
3 }

方法四:

1 if ($('#checkbox-id').prop("checked")) {
2     // do something
3 }

方法五://屬于原生js的方法,存在一點(diǎn)弊端

1 if (ele.checked) { 
2      // do something
3  }
一,$(ele).is(":checked")
復(fù)制代碼
 1 function IsSelect(ele){
 2 //判斷checkbox是否被選中  
 3 if($(ele).is(":checked")){      
 4 alert('選中'); 
 5 alert($(ele).val()) 
 6 }  
 7 else{       
 8 alert('未選中');  
 9 }
10 }
復(fù)制代碼

二,$(ele).prop("checked")

1 //用jquery全選所有class為listbox的checkbox  
2 $(".listbox").prop("checked", true);  
3 //用jquery取消所有class為listbox的checkbox的選中  
4 $(".listbox").prop("checked", false);
5  

三,使用 attr 方法設(shè)置選擇。

復(fù)制代碼
 1 $(function(){
 2     var checkbox = $("input[type='checkbox']");
 3     //全選
 4     $('#select-all').click(function(){
 5         checkbox.attr('checked', true);
 6     });
 7     //反選
 8     $('#select-reverse').click(function(){
 9         checkbox.each(function(i, dom){
10             if ( $(dom).attr('checked') ) {
11                 $(dom).removeAttr('checked');
12             } else {
13                 $(dom).attr('checked', 'checked');
14             }
15         });
16     });
17 });
復(fù)制代碼

四,對于jQuery 1.6.0+ 的版本,可以使用prop方法來設(shè)置是否選中。

 

復(fù)制代碼
 1 $(function(){
 2     var checkbox = $("input[type='checkbox']");
 3     //全選
 4     $('#select-all').click(function(){
 5         checkbox.prop("checked", true);
 6     });
 7     //反選
 8     $('#select-reverse').click(function(){
 9         checkbox.prop("checked", function(index, attr){
10             return !attr;
11         });
12     });
13 });
復(fù)制代碼

 

五,jQuery中attr和prop方法的區(qū)別

rop是jquery1.6新增的方法,其與attr的用法極為相似。由于不理解他們的根本區(qū)別,難免產(chǎn)生離奇的BUG。
通過分析attr和prop的源碼,得知:
attr方法里面,最關(guān)鍵的兩行代碼,elem.setAttribute( name, value + “” )和ret = elem.getAttribute( name ),很明顯的看出來,使用的DOM的API setAttribute和getAttribute方法操作的屬性元素節(jié)點(diǎn)。
prop方法里面,最關(guān)鍵的兩行代碼,return ( elem[ name ] = value )和return elem[ name ],你可以理解成這樣document.getElementById(el)[name] = value,這是轉(zhuǎn)化成JS對象的一個屬性。

還可以看看其他文章,謝謝您的閱讀。
網(wǎng)站申明:系本文編輯轉(zhuǎn)載,來源于網(wǎng)絡(luò),目的在于傳遞更多信息,并不代表本網(wǎng)贊同其觀點(diǎn)和對其真實(shí)性負(fù)責(zé),所有權(quán)歸屬原作者。如內(nèi)容、圖片有任何版權(quán)問題,請聯(lián)系我們刪除
上一篇:Oracle中select 1和select *有什么區(qū)別? 下一篇:(轉(zhuǎn))C# TextBox ReadOnly / Enabled 時,在后臺代碼中卻無法獲得該值,如何解決?
更多相關(guān)的物流文章
IT編程技術(shù)  互聯(lián)網(wǎng)  2023-10-07  瀏覽:9150次
IT編程技術(shù)  互聯(lián)網(wǎng)  2023-02-04  瀏覽:11400次
IT編程技術(shù)  互聯(lián)網(wǎng)  2022-11-24  瀏覽:12219次
IT編程技術(shù)  互聯(lián)網(wǎng)  2022-11-17  瀏覽:12902次
IT編程技術(shù)  互聯(lián)網(wǎng)  2022-11-17  瀏覽:12217次
IT編程技術(shù)  互聯(lián)網(wǎng)  2022-11-14  瀏覽:12254次
IT編程技術(shù)  互聯(lián)網(wǎng)  2022-11-06  瀏覽:12585次
IT編程技術(shù)  互聯(lián)網(wǎng)  2022-11-05  瀏覽:12106次
IT編程技術(shù)  互聯(lián)網(wǎng)  2022-11-05  瀏覽:11696次
IT編程技術(shù)  互聯(lián)網(wǎng)  2022-10-28  瀏覽:13522次
正在被瀏覽的文章
【IT編程技術(shù)】熱點(diǎn)文章
“掃一掃”微信公眾號
好運(yùn)物流網(wǎng)公眾號二維碼
關(guān)于好運(yùn)物流網(wǎng) - 聯(lián)系好運(yùn)網(wǎng) - 物流公司查詢 - 物流知道 - 幫助中心 - 網(wǎng)站地圖
溫馨提示:防范支招 安全警示:貨運(yùn)合作要有安全意識,需當(dāng)面核實(shí)對方真實(shí)身份,要簽訂合同/協(xié)議、提供身份證等(防范支招)
免責(zé)聲明:本站只起到物流信息平臺作用,內(nèi)容的準(zhǔn)確性以及物流過程中出現(xiàn)的任何風(fēng)險均由發(fā)布者負(fù)責(zé),與平臺無關(guān)。
好運(yùn)物流網(wǎng)(haoyun56.com)  備案號:浙ICP備10210792號-4

浙公網(wǎng)安備 33080202000006號