快捷導(dǎo)航

方便實(shí)用的jQuery checkbox復(fù)選框全選功能簡(jiǎn)單實(shí)例

更新時(shí)間：2013年10月09日 15:52:20 作者：

這篇文章介紹了jQuery checkbox復(fù)選框全選功能的代碼實(shí)例，有需要的朋友可以參考一下

// 主復(fù)選框
<input type="checkbox" id="ck" name="ckAll">// 子復(fù)選框項(xiàng)
<input type="checkbox" id="ck1" name="ckItm">
<input type="checkbox" id="ck2" name="ckItm">
<input type="checkbox" id="ck3" name="ckItm">

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

var $ckAll = $("input[name='ckAll']");
var $ckItm = $("input[name='ckItm']");
var len = $ckItm.length;
$ckAll.click(function() {
　　// 獲取$ckAll當(dāng)前選中狀態(tài)，如果選中，其他子復(fù)選框則選中，反之則取消
    $ckItm.prop('checked',this.checked);
});
$ckItm.click(function() {
    // 給b綁定判斷事件
    var b=$ckItm.filter(":checked").length==len;// 當(dāng)所選的子復(fù)選框個(gè)數(shù)等于總個(gè)數(shù)，主復(fù)選框則會(huì)被選中
    // 通過(guò)三元運(yùn)算判斷
    var flag=$ckAll.prop("checked",b?true:false);
});

您可能感興趣的文章:

相關(guān)文章

淺談jquery頁(yè)面初始化的4種方式
本文介紹了Jquery頁(yè)面初始化的4種方式的實(shí)例代碼，需要的朋友可以看下
2016-11-11
DOM事件階段以及事件捕獲與事件冒泡先后執(zhí)行順序(圖文詳解)
DOM事件標(biāo)準(zhǔn)定義了兩種事件流，這兩種事件流有著顯著的不同并且可能對(duì)你的應(yīng)用有著相當(dāng)大的影響。這兩種事件流分別是捕獲和冒泡。和許多Web技術(shù)一樣，在它們成為標(biāo)準(zhǔn)之前，Netscape和微軟各自不同地實(shí)現(xiàn)了它們，下面介紹DOM事件階段以及事件捕獲與事件冒泡先后執(zhí)行順序
2015-08-08
jQuery打印指定區(qū)域Html頁(yè)面并自動(dòng)分頁(yè)
項(xiàng)目中需要用到打印HTML頁(yè)面，需要指定區(qū)域打印，使用jquery.PrintArea.js 插件實(shí)現(xiàn)分頁(yè),需要的朋友可以參考下
2014-07-07
jQuery阻止移動(dòng)端遮罩層后頁(yè)面滾動(dòng)
本文主要介紹了jQuery阻止移動(dòng)端遮罩層后頁(yè)面滾動(dòng)的方法。具有很好的參考價(jià)值。下面跟著小編一起來(lái)看下吧
2017-03-03
淺談ajax請(qǐng)求不同頁(yè)面的微信JSSDK問(wèn)題
下面小編就為大家分享一篇淺談ajax請(qǐng)求不同頁(yè)面的微信JSSDK問(wèn)題，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧
2018-02-02
jquery查找tr td 示例模擬
jquery怎么查找tr td，下面模擬了一個(gè)table出來(lái)，給大家參考
2014-05-05
Easyui ueditor 整合解決不能編輯的問(wèn)題(推薦)
這篇文章主要介紹了Easyui ueditor 整合解決不能編輯的問(wèn)題 ,需要的朋友可以參考下
2017-06-06
jquery dataview數(shù)據(jù)視圖插件使用方法
這篇文章主要介紹了jquery dataview數(shù)據(jù)視圖插件使用方法，數(shù)據(jù)填充與視圖更新利器，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2016-12-12
jQuery實(shí)現(xiàn)文件編碼成base64并通過(guò)AJAX上傳的方法
這篇文章主要介紹了jQuery實(shí)現(xiàn)文件編碼成base64并通過(guò)AJAX上傳的方法,涉及jQuery前臺(tái)使用FileReader對(duì)象編碼base64文件進(jìn)行ajax上傳及后臺(tái)php處理相關(guān)操作技巧,需要的朋友可以參考下
2018-04-04
基于LayUI分頁(yè)和LayUI laypage分頁(yè)的使用示例
本篇文章主要介紹了基于LayUI分頁(yè)和LayUI laypage分頁(yè)的使用示例，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
2017-08-08