jQuery CheckBox全選、全不選實(shí)現(xiàn)代碼小結(jié)
更新時(shí)間：2010年04月30日 10:46:04 作者：
jQuery CheckBox全選、全不選實(shí)現(xiàn)代碼小結(jié)，對(duì)于操作jquery的朋友可以參考下。
直接上代碼。
[Ctrl+A 全選 注:引入外部Js需再刷新一下頁(yè)面才能執(zhí)行]
下面的代碼比較全，是基于js的控制原理實(shí)現(xiàn)
<script src="http://img.jb51.net/jslib/jquery/jquery14.js"></script>
<script type="text/javascript">
//全選
function CheckedAll(){
$(':checkbox').attr('checked','checked');
}
//全不選
function CheckedNo(){
$(':checkbox').attr('checked','');
}
//反選
function CheckedRev(){
var arr = $(':checkbox');
for(var i=0;i<arr.length;i++){
arr[i].checked = ! arr[i].checked;
}
}
</script>
<body>
<div>
<input id="CheckAll" type="checkbox" />
<input name="subBox" type="checkbox" />
<input name="subBox" type="checkbox" />
<input name="subBox" type="checkbox" />
<input name="subBox" type="checkbox" />
</div>
<input type="button" name="btnCheckedAll" value="全 選" onclick="javascript:CheckedAll();" />
<input type="button" name="btnCheckedNo" value="全不選" onclick="javascript:CheckedNo();" />
<input type="button" name="btnCheckedRev" value="反 選" onclick="javascript:CheckedRev();" />
</body>
[Ctrl+A 全選 注:引入外部Js需再刷新一下頁(yè)面才能執(zhí)行]
下面的代碼比較全，是基于js的控制原理實(shí)現(xiàn)
復(fù)制代碼 代碼如下:
<script src="http://img.jb51.net/jslib/jquery/jquery14.js"></script>
<script type="text/javascript">
//全選
function CheckedAll(){
$(':checkbox').attr('checked','checked');
}
//全不選
function CheckedNo(){
$(':checkbox').attr('checked','');
}
//反選
function CheckedRev(){
var arr = $(':checkbox');
for(var i=0;i<arr.length;i++){
arr[i].checked = ! arr[i].checked;
}
}
</script>
<body>
<div>
<input id="CheckAll" type="checkbox" />
<input name="subBox" type="checkbox" />
<input name="subBox" type="checkbox" />
<input name="subBox" type="checkbox" />
<input name="subBox" type="checkbox" />
</div>
<input type="button" name="btnCheckedAll" value="全 選" onclick="javascript:CheckedAll();" />
<input type="button" name="btnCheckedNo" value="全不選" onclick="javascript:CheckedNo();" />
<input type="button" name="btnCheckedRev" value="反 選" onclick="javascript:CheckedRev();" />
</body>
您可能感興趣的文章:
- jquery實(shí)現(xiàn)全選、反選、獲得所有選中的checkbox
- JQUERY復(fù)選框CHECKBOX全選,取消全選
- 用JQuery實(shí)現(xiàn)全選與取消的兩種簡(jiǎn)單方法
- jQuery判斷checkbox(復(fù)選框)是否被選中以及全選、反選實(shí)現(xiàn)代碼
- jquery操作checkbox實(shí)現(xiàn)全選和取消全選
- jquery復(fù)選框CHECKBOX全選、反選
- JQUERY CHECKBOX全選,取消全選,反選方法三
- jquery一鍵控制checkbox全選、反選或全不選
- 基于JQuery實(shí)現(xiàn)CheckBox全選全不選
- jquery實(shí)現(xiàn)全選功能
相關(guān)文章
這篇文章主要介紹了jquery中$.ajax方法提交表單的方法及介紹，希望對(duì)大家有所幫助2014-11-11
jQuery插件Zclip實(shí)現(xiàn)完美兼容個(gè)瀏覽器點(diǎn)擊復(fù)制內(nèi)容到剪貼板
本文將結(jié)合實(shí)例講解如何使用一款基于jQuery的插件——Zclip來(lái)實(shí)現(xiàn)復(fù)制內(nèi)容到剪貼板的功能。其實(shí)IE上有個(gè)方法可以實(shí)現(xiàn)點(diǎn)擊復(fù)制，但是由于只是IE獨(dú)有，所以我們不提倡。而Zclip是利用一個(gè)隱藏的flash文件來(lái)完成復(fù)制的功能，關(guān)鍵是它兼容當(dāng)前各主流瀏覽器。2015-04-04
這篇文章主要介紹了jQuery自帶的一些常用方法總結(jié),包括$.trim 、$.contains、$.each、$.map、$.inArray、$.extend等,需要的朋友可以參考下2014-09-09
這篇文章主要介紹了jQuery多級(jí)彈出菜單插件ZoneMenu的使用方法，有需要的小伙伴可以參考下2014-12-12
這篇文章主要介紹了使用jQuery管理選擇結(jié)果的相關(guān)資料,需要的朋友可以參考下2015-01-01
使用ajax在前端驗(yàn)證是否執(zhí)行某個(gè)操作，下面為大家介紹下jquery.post的具體使用2014-01-01
jquery 簡(jiǎn)單導(dǎo)航實(shí)現(xiàn)代碼
jquery簡(jiǎn)單導(dǎo)航實(shí)現(xiàn)代碼，需要的朋友可以參考下。2009-09-09
今天小編就為大家分享一篇關(guān)于jquery的$().each和$.each的區(qū)別，小編覺(jué)得內(nèi)容挺不錯(cuò)的，現(xiàn)在分享給大家，具有很好的參考價(jià)值，需要的朋友一起跟隨小編來(lái)看看吧2019-01-01
在jQuery 中$("<span>")，這個(gè)語(yǔ)法等同于$(document.createElement("span")) ，這是一種用法2011-04-04
jQuery使用$.each遍歷json數(shù)組的簡(jiǎn)單實(shí)現(xiàn)方法
這篇文章主要介紹了jQuery使用$.each遍歷json數(shù)組的簡(jiǎn)單實(shí)現(xiàn)方法,結(jié)合實(shí)例形式分析了each方法遍歷json數(shù)組的實(shí)現(xiàn)技巧與相關(guān)注意事項(xiàng),需要的朋友可以參考下2016-04-04