jQuery實(shí)現(xiàn)復(fù)選框的全選和反選
更新時(shí)間：2017年02月02日 13:40:43 作者：小小趙老漢
本文主要分享了使用jQuery實(shí)現(xiàn)復(fù)選框的全選和反選的示例代碼。具有很好的參考價(jià)值，下面跟著小編一起來(lái)看下吧
話不多說(shuō)，請(qǐng)看代碼
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<form>
<label for="apple">蘋(píng)果</label>
<input type="checkbox" name="apple">
<label for="banana">香蕉</label>
<input type="checkbox" name="banana">
<label for="orange">橘子</label>
<input type="checkbox" name="orange">
<input type="button" value="全選" onclick="allPick()">
<input type="button" value="全不選" onclick="unAllPick()">
<input type="button" value="反轉(zhuǎn)" onclick="inverserPick()">
</form>
<script src="http://cdn.bootcss.com/jquery/3.1.1/jquery.min.js"></script>
<script>
// 全選
function allPick() {
$("[type=checkbox]:checkbox").each(function () {
this.checked = true;
})
}
// 全不選
function unAllPick() {
$("[type=checkbox]:checkbox").each(function () {
this.checked = false;
})
}
// 反轉(zhuǎn)
function inverserPick() {
$("[type=checkbox]:checkbox").each(function () {
this.checked = !this.checked;
})
}
</script>
</body>
</html>
以上就是本文的全部?jī)?nèi)容，希望本文的內(nèi)容對(duì)大家的學(xué)習(xí)或者工作能帶來(lái)一定的幫助，同時(shí)也希望多多支持腳本之家！
您可能感興趣的文章:
- 基于JavaScript實(shí)現(xiàn)全選、不選和反選效果
- JQuery實(shí)現(xiàn)列表中復(fù)選框全選反選功能封裝(推薦)
- jquery實(shí)現(xiàn)全選、不選、反選的兩種方法
- js實(shí)現(xiàn)checkbox全選和反選示例
- asp.net GridView控件中模板列CheckBox全選、反選、取消
- jQuery判斷checkbox(復(fù)選框)是否被選中以及全選、反選實(shí)現(xiàn)代碼
- jquery復(fù)選框CHECKBOX全選、反選
- jquery實(shí)現(xiàn)全選、反選、獲得所有選中的checkbox
- Android checkbox的listView(多選,全選,反選)具體實(shí)現(xiàn)方法
- js, jQuery實(shí)現(xiàn)全選、反選功能
相關(guān)文章
JQuery 實(shí)現(xiàn)在同一頁(yè)面錨點(diǎn)鏈接之間的平滑滾動(dòng)
JQuery 原來(lái)比我想象的要強(qiáng)大的多，本文用 JQuery 實(shí)現(xiàn)錨點(diǎn)鏈接之間的平滑滾動(dòng)，在同一頁(yè)面的錨點(diǎn)鏈接之間實(shí)現(xiàn)平滑的滾動(dòng)2014-10-10
本文是小編根據(jù)bootstrap的折疊設(shè)計(jì)的樹(shù)狀圖顯示效果，只有二級(jí)顯示，可以用在簡(jiǎn)單的目錄等。對(duì)實(shí)現(xiàn)代碼感興趣的朋友可以參考下本文2016-11-11
使用BootStrap和Metroui設(shè)計(jì)的metro風(fēng)格微網(wǎng)站或手機(jī)app界面
今天使用bootstrap和metroui設(shè)計(jì)了一個(gè)metro風(fēng)格的移動(dòng)app或者微信微網(wǎng)站的界面，非常不錯(cuò)具有參考借鑒價(jià)值，感興趣的朋友可以參考下2016-10-10
jQuery 學(xué)習(xí)入門(mén)篇附實(shí)例代碼
這篇文章比較不錯(cuò)，更重要的是一些實(shí)例代碼，對(duì)于想學(xué)習(xí)jquery的朋友是個(gè)不錯(cuò)的資料。2010-03-03
jquery實(shí)現(xiàn)簡(jiǎn)單的拖拽效果實(shí)例兼容所有主流瀏覽器
拖拽效果個(gè)人覺(jué)得是一種不錯(cuò)的用戶體驗(yàn)，抽空研究了一下，原理還蠻簡(jiǎn)單的，具體實(shí)現(xiàn)如下，感興趣的朋友可以參考下哈2013-06-06
jquery點(diǎn)擊獲取動(dòng)態(tài)數(shù)據(jù)進(jìn)行傳參問(wèn)題
這篇文章主要介紹了jquery點(diǎn)擊獲取動(dòng)態(tài)數(shù)據(jù)進(jìn)行傳參問(wèn)題，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2022-12-12
jQuery確實(shí)是一個(gè)挺好的輕量級(jí)的JS框架，能幫助我們快速的開(kāi)發(fā)JS應(yīng)用，并在一定程度上改變了我們寫(xiě)JavaScript代碼的習(xí)慣。2011-04-04
jQuery實(shí)現(xiàn)左右切換焦點(diǎn)圖
這篇文章主要介紹了jQuery實(shí)現(xiàn)左右切換焦點(diǎn)圖的核心代碼，有需要的小伙伴可以參考下2015-04-04
本文給大家分享了一個(gè)jQuery操作session的插件jQuerysession，并做了簡(jiǎn)單介紹，及基本語(yǔ)法，非常不錯(cuò)的一個(gè)插件，推薦給小伙伴們。2015-01-01
為了讓本地圖片、遠(yuǎn)程圖片、過(guò)小的圖片都適應(yīng)此插件，有很多細(xì)節(jié)問(wèn)題要處理。2009-11-11