jQuery實(shí)現(xiàn)checkbox全選的方法

更新時(shí)間：2015年06月10日 10:47:58 作者：spring21st

這篇文章主要介紹了jQuery實(shí)現(xiàn)checkbox全選的方法,涉及jQuery操作頁(yè)面元素屬性及鼠標(biāo)事件響應(yīng)的相關(guān)技巧,需要的朋友可以參考下

本文實(shí)例講述了jQuery實(shí)現(xiàn)checkbox全選的方法。分享給大家供大家參考。具體分析如下：

通過(guò)checkbox 進(jìn)行全選和取消全選的操作，如果通過(guò)toggle進(jìn)行處理，則會(huì)出現(xiàn)checkbox無(wú)法顯示對(duì)勾的問(wèn)題。

使用click事件，根據(jù)checked屬性進(jìn)行判斷即可。

示例：

$("#chkRreviewOffline").click(function(){ 
  if(this.checked){ 
    $('#review-offline .btn_checkbox input[type=checkbox]').each(function(index){ 
      this.checked=true; 
    }); 
  }else{ 
    $('#review-offline .btn_checkbox input[type=checkbox]').each(function(index){ 
      this.checked=false; 
    }); 
  } 
}); 
$('#review-offline .btn_checkbox input[type=checkbox]').each(function(index){ 
  $(this).click(function(){ 
    if(this.checked){ 
      //console.log('checked'); 
    }else{ 
      //console.log('not checked'); 
      $("#chkRreviewOffline").get(0).checked=false; 
    } 
  }); 
});

其中，下面的each()方法用于當(dāng)頁(yè)面其它的checkbox有未選中狀態(tài)，則全選狀態(tài)取消。

希望本文所述對(duì)大家的jQuery程序設(shè)計(jì)有所幫助。

您可能感興趣的文章:

相關(guān)文章

JQuery中使用on方法綁定hover事件實(shí)例
這篇文章主要介紹了JQuery中使用on方法綁定hover事件實(shí)例,本文用于一些特殊環(huán)境下,需要的朋友可以參考下
2014-12-12
jQuery替換節(jié)點(diǎn)用法示例(使用replaceWith方法)
這篇文章主要介紹了jQuery替換節(jié)點(diǎn)的方法,結(jié)合簡(jiǎn)單實(shí)例形式分析了jQuery使用replaceWith方法替換P標(biāo)簽顯示內(nèi)容的相關(guān)實(shí)現(xiàn)技巧,需要的朋友可以參考下
2016-09-09
jQuery Validate表單驗(yàn)證插件的基本使用方法及功能拓展
這篇文章主要介紹了jQuery Validate表單驗(yàn)證插件的基本使用方法及功能拓展的相關(guān)資料,本文給大家介紹的非常詳細(xì)，需要的朋友可以參考下
2017-01-01
jQuery解決input超多的表單提交
本文給大家分享的是使用jQuery+php解決input超多的表單提交的思路和方法，非常的簡(jiǎn)單實(shí)用，有需要的小伙伴可以參考下。
2015-08-08
jQuery插件FusionCharts繪制的3D餅狀圖效果實(shí)例【附demo源碼下載】
這篇文章主要介紹了jQuery插件FusionCharts繪制的3D餅狀圖效果,結(jié)合完整實(shí)例形式分析了基于FusionCharts圖形插件繪制餅狀圖的操作技巧,并附帶demo源碼供讀者下載參考,需要的朋友可以參考下
2017-03-03
jQuery動(dòng)態(tài)背景圖片效果實(shí)現(xiàn)方法
這篇文章主要介紹了jQuery動(dòng)態(tài)背景圖片效果實(shí)現(xiàn)方法,涉及javascript隨機(jī)數(shù)及動(dòng)態(tài)設(shè)置css樣式的相關(guān)技巧,非常簡(jiǎn)單實(shí)用,需要的朋友可以參考下
2015-07-07
jquery實(shí)現(xiàn)用戶(hù)信息修改驗(yàn)證輸入方法匯總
這篇文章主要介紹了jquery實(shí)現(xiàn)用戶(hù)信息修改驗(yàn)證輸入方法,實(shí)例匯總了jquery常用的提交、驗(yàn)證、判定、修改等相關(guān)技巧,非常實(shí)用,需要的朋友可以參考下
2015-07-07
jQuery+Ajax實(shí)現(xiàn)限制查詢(xún)間隔的方法
這篇文章主要介紹了jQuery+Ajax實(shí)現(xiàn)限制查詢(xún)間隔的方法,涉及jQuery的ajax方法參數(shù)設(shè)置及asp.net后臺(tái)交互的相關(guān)技巧,需要的朋友可以參考下
2016-06-06
最新的10款jQuery內(nèi)容滑塊插件分享
本篇文章介紹10款新鮮、有用的jQuery內(nèi)容導(dǎo)航插件，肯定是免費(fèi)的了，希望對(duì)你有幫助。
2011-09-09
jQuery ajax調(diào)用webservice注意事項(xiàng)
這篇文章主要為大家詳細(xì)介紹了jQuery ajax調(diào)用webservice的注意事項(xiàng)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2017-10-10