基于jQuery的checkbox全選問題分析
本文實(shí)例分析了基于jQuery的checkbox全選問題。分享給大家供大家參考,具體如下:
最近開發(fā)項(xiàng)目時(shí)遇到一個(gè)很奇怪的問題,就是checkbox的全選與全不選
使用jQuery的框架。一直是使用
//檢測選中的checkbox $('input[name="abc"]:checked').each(function(){})
但是,發(fā)現(xiàn)我需要全選的時(shí)候,使用
$('input[name="abc"]').attr('checked',true); $('input[name="abc"]').attr('checked',false);
時(shí),第一次加載的時(shí)候管用,再次點(diǎn)擊就只顯示它自己了
但是點(diǎn)擊的時(shí)候,查看源代碼,屬性checked已經(jīng)添加上了
百思不得其解,最后搜索到,原來是 attr屬性 對于checked來說他不會(huì)使dom樣式改變,只會(huì)將它的屬性值改變,jquery提供了取而代之的方法,如下就可以了
$('input[name="abc"]').prop('checked',true); $('input[name="abc"]').prop('checked',false);
但是,問題又來了,不全選時(shí)我檢測不到哪個(gè)元素被點(diǎn)擊了,然后就在name上做文章
$('input[name="abc[]:checked"').each(function(i){}); //或者 $('input[name="abc[]"').each(function(i){ var flag = $(this).prop('checked'); if(flag){ //$(this) 即為選中元素 } })
問題解決。
更多關(guān)于jQuery相關(guān)內(nèi)容感興趣的讀者可查看本站專題:《jQuery form操作技巧匯總》、《jQuery切換特效與技巧總結(jié)》、《jQuery拖拽特效與技巧總結(jié)》、《jQuery擴(kuò)展技巧總結(jié)》、《jQuery常見經(jīng)典特效匯總》、《jQuery動(dòng)畫與特效用法總結(jié)》、《jquery選擇器用法總結(jié)》及《jQuery常用插件及用法總結(jié)》
希望本文所述對大家jQuery程序設(shè)計(jì)有所幫助。
- jQuery實(shí)現(xiàn)CheckBox全選、全不選功能
- jQuery Checkbox 全選 反選的簡單實(shí)例
- jQuery實(shí)現(xiàn)checkbox列表的全選、反選功能
- jQuery對checkbox 復(fù)選框的全選全不選反選的操作
- jQuery實(shí)現(xiàn)checkbox全選的方法
- JQuery選中checkbox方法代碼實(shí)例(全選、反選、全不選)
- Jquery 實(shí)現(xiàn)checkbox全選方法
- jquery中checkbox全選失效的解決方法
- jquery操作checkbox實(shí)現(xiàn)全選和取消全選
- jquery、js操作checkbox全選反選
- jq checkbox 的全選并ajax傳參的實(shí)例
相關(guān)文章
jquery.validate使用攻略 第五步 正則驗(yàn)證
一些常用的驗(yàn)證腳本2010-07-07Jquery Easyui日歷組件Calender使用詳解(23)
這篇文章主要為大家詳細(xì)介紹了Jquery Easyui日歷組件Calender的使用方法,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2016-12-12jQuery使用slideUp方法實(shí)現(xiàn)控制元素緩慢收起
這篇文章主要介紹了jQuery使用slideUp方法實(shí)現(xiàn)控制元素緩慢收起的功能,實(shí)例分析了jQuery中slideUp方法的使用技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-03-03jquery+CSS3實(shí)現(xiàn)淘寶移動(dòng)網(wǎng)頁菜單效果
這篇文章主要介紹了jquery+CSS3實(shí)現(xiàn)淘寶移動(dòng)網(wǎng)頁菜單效果,實(shí)例分析了jquery操作頁面樣式動(dòng)態(tài)變換及熱區(qū)的選擇技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-08-08學(xué)習(xí)jquery必備 api中英文對照的chm手冊 下載
學(xué)習(xí)jquery必備 api中英文對照的chm手冊 下載...2007-05-05Jquery和Js獲得元素標(biāo)簽名稱的方法總結(jié)
下面小編就為大家?guī)硪黄狫query和Js獲得元素標(biāo)簽名稱的方法總結(jié)。小編覺得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2016-10-10通過jQuery源碼學(xué)習(xí)javascript(二)
昨天寫了篇通過jQuery源碼學(xué)習(xí)javascript(一),里面有一個(gè)定義對象C的方法,我早期也沒有太注意這個(gè)方面的技術(shù)細(xì)節(jié)。后來我查了一下資料,發(fā)現(xiàn)里面有很多巧的地方。今天與大家分享2012-12-12