jquery復(fù)選框全選/取消示例

更新時(shí)間：2013年12月30日 15:51:27 作者：

jquery復(fù)選框全選/取消示例,實(shí)現(xiàn)點(diǎn)擊復(fù)選框的時(shí)候全選所有的子復(fù)選框，再點(diǎn)擊取消所有復(fù)選框的選中狀態(tài)

功能：

a:實(shí)現(xiàn)點(diǎn)擊復(fù)選框的時(shí)候全選所有的子復(fù)選框，再點(diǎn)擊取消所有復(fù)選框的選中狀態(tài)

b:有一個(gè)子復(fù)選框選中則父復(fù)選框選中所有子復(fù)選框都不選中則父復(fù)選框不選中

/**
 * 全選函數(shù)
 * @param mainId 主復(fù)選框id
 * @param klass 下屬?gòu)?fù)選框的class
 */
function selectAll(mainId,klass){
 $("." + klass).each(function(){
     if($("#" + mainId).attr("checked")== "checked"){
      $(this).attr("checked", "checked");
     }
     else{
      $(this).removeAttr("checked");
     }
 });
}

以上實(shí)現(xiàn)全選及全部取消所有子復(fù)選框，至于數(shù)據(jù)的實(shí)現(xiàn)則在控制器里接收到復(fù)選框的數(shù)組即可

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

/**
 * 子復(fù)選框有一個(gè)選中 父復(fù)選框就選中 <br>子復(fù)選框全不選 父復(fù)選框不選中
 * @param father 父復(fù)選框的id
 * @param son 子復(fù)選框的class
 */
function checkSonCheckBox(father,son){
 $("."+son).click(function(){
  if($(this).attr("checked")== "checked"){
   $(this).addClass("checked");
  }else{
   $(this).removeClass("checked");
  }
  if($("."+son).hasClass("checked")){
   $("#"+father).attr("checked","checked");
//   console.log("至少有一個(gè)子復(fù)選框選中！");
  }else{
   $("#"+father).removeAttr("checked");
//   console.log("所有子復(fù)選框都未選中！");
  }
 });
};

以上實(shí)現(xiàn) 一個(gè)子復(fù)選框選中則父復(fù)選框選中所有子復(fù)選框都不選中則父復(fù)選框不選中

您可能感興趣的文章:

復(fù)選框全選

相關(guān)文章

jQuery插件EnPlaceholder實(shí)現(xiàn)輸入框提示文字
EnPlaceholder插件支持密碼框哦！實(shí)際對(duì)比同類的placeholder插件在ie等瀏覽器下效果要好很多！下面我們來具體探討下此插件的使用方法吧。
2015-06-06
基于JQuery的訪問WebService的代碼（可訪問Java[Xfire]）
最近有些時(shí)間學(xué)習(xí)了下JQuery，發(fā)現(xiàn)有很多JQuery訪問.net WebService的例子。作為WebService這種接口應(yīng)該是通用的，為什么沒人關(guān)于Java的例子呢？這點(diǎn)引起我的興趣。
2010-11-11
jQuery插件bxSlider實(shí)現(xiàn)響應(yīng)式焦點(diǎn)圖
bxSlider特性1.充分響應(yīng)各種設(shè)備，適應(yīng)各種屏幕；2.支持多種滑動(dòng)模式，水平、垂直以及淡入淡出效果；3.支持圖片、視頻以及任意html內(nèi)容；4.支持觸摸滑動(dòng)；5.支持Firefox，Chrome，Safari，iOS，Android，IE7+，下面我們就來詳細(xì)探討下吧。
2015-04-04
jQuery File Upload文件上傳插件使用詳解
jQuery File Upload 是一個(gè)Jquery文件上傳組件，支持多文件上傳、取消、刪除，上傳前縮略圖預(yù)覽、列表顯示圖片大小，支持上傳進(jìn)度條顯示；支持各種動(dòng)態(tài)語言開發(fā)的服務(wù)器端.這篇文章主要介紹了jQuery File Upload文件上傳插件使用,需要的朋友可以參考下
2016-12-12
jQuery使用unlock.js插件實(shí)現(xiàn)滑動(dòng)解鎖
unlock.js插件具有滑動(dòng)解鎖，尺寸、顏色、字體大小等都可以個(gè)性化定制等特點(diǎn)，接下來通過本文給大家分享jQuery使用unlock.js插件實(shí)現(xiàn)滑動(dòng)解鎖思路講解，感興趣的朋友一起看看吧
2017-04-04
jQuery實(shí)現(xiàn)的監(jiān)聽導(dǎo)航滾動(dòng)置頂狀態(tài)功能示例
這篇文章主要介紹了jQuery實(shí)現(xiàn)的監(jiān)聽導(dǎo)航滾動(dòng)置頂狀態(tài)功能,涉及基于jQuery的事件響應(yīng)及狀態(tài)監(jiān)聽等相關(guān)操作技巧,需要的朋友可以參考下
2018-07-07
jQuery Easyui DataGrid點(diǎn)擊某個(gè)單元格即進(jìn)入編輯狀態(tài)焦點(diǎn)移開后保存數(shù)據(jù)
這篇文章主要介紹了jQuery Easyui DataGrid點(diǎn)擊某個(gè)單元格即進(jìn)入編輯狀態(tài)焦點(diǎn)移開后保存數(shù)據(jù)的相關(guān)資料,非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友可以參考下
2016-08-08
關(guān)于jQuery里prev()的簡(jiǎn)單操作代碼
這篇文章主要介紹了jQuery里prev()的簡(jiǎn)單操作代碼,非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友可以參考下
2017-10-10
capacityFixed 基于jquery的類似于新浪微博新消息提示的定位框
公司項(xiàng)目需求中有一個(gè)類似于新浪微博新消息提示的定位框的效果，需要的朋友可以參考下。
2011-05-05
jQuery實(shí)現(xiàn)漂亮實(shí)用的商品圖片tips提示框效果(無圖片箭頭+陰影)
這篇文章主要介紹了jQuery實(shí)現(xiàn)漂亮實(shí)用的商品圖片tips提示框效果,具有鼠標(biāo)滑過顯示動(dòng)態(tài)提示框的效果,涉及針對(duì)鼠標(biāo)事件的響應(yīng)及頁面元素動(dòng)態(tài)操作技巧,需要的朋友可以參考下
2016-04-04