jQuery Checkbox 全選反選的簡單實例

更新時間：2016年11月29日 08:34:56 作者：森林王子

本文主要介紹了Checkbox的全選、反選的簡單實例,需要的朋友可以參考下

1.全選、反選

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
 <title></title>
 <script src="http://xiazai.jb51.net/201611/yuanma/jquery(jb51.net).rar"></script>
 <script type="text/javascript">
  $(function () {
   $("#selall").on("click", function () { $("#plalst :checkbox").prop("checked", true); });
   $("#selnone").on("click", function () { $("#plalst :checkbox").prop("checked", false); });
   $("#resver").on("click", function () { $("#plalst :checkbox").prop("checked", function (i, val) { return !val; }); });
   $("#chkAll").on("click", function () { $("#plalst :checkbox").prop("checked", $("#chkAll").prop("checked")) });

  });
 </script>
</head>
<body>
 <div id="plalst">
  <input type="checkbox" />一隊
  <input type="checkbox" />二隊
  <input type="checkbox" />三隊
  <input type="checkbox" />四隊
  <input type="checkbox" />五隊
  <input type="checkbox" />六隊
 </div>
 <br /><br /><br />
 <input type="button" id="selall" value="全選" />
 <input type="button" id="selnone" value="全不選" />
 <input type="button" id="resver" value="反選" />
 <input type="checkbox" id="chkAll" /><label for="chkAll" >選擇</label>
</body>
</html>

以上就是本文的全部內容，希望對大家有所幫助，同時也希望多多支持腳本之家！

您可能感興趣的文章:

jquery 實現輪播圖詳解及實例代碼
這篇文章主要介紹了jquery 實現輪播圖相關資料,經過一段時間學習jquery 的知識，這里寫一個簡單的輪播圖，需要的朋友可以參考下
2016-10-10
jquery下checked取值問題的解決方法
修改checkbox時..jquery在取checked值時總是出這樣那樣的問題....各個版本之間還有少許的差異....當向后臺發(fā)送數據后,,再返回到當前頁時..checked的狀態(tài)始終不對
2012-08-08
基于JQuery.timer插件實現一個計時器
基于JQuery.timer插件實現一個計時器，需要的朋友可以參考下。
2010-04-04
jquery實現html頁面 div 假分頁有原理有代碼
大概原理就是填充后div的總高度（1000px）顯示高度（100px）則頁面總數為10頁。當查看第二頁時，顯示的div高度為100 - 200之間，以此類推
2014-09-09
通過jquery的$.getJSON做一個跨域ajax請求試驗
jquery提供了$.getJSON的方法，讓我們可以實現跨域ajax請求，但jqueryAPI上的內容實在太少，如何用$.getJSON，請求網站應該返回怎樣的數據庫才能讓$.getJSON獲取到，下面我就用一個實際例子來說明下。
2011-05-05
jQuery Easyui Datagrid實現單行的上移下移及保存移動的結果
這篇文章主要介紹了jQuery Easyui Datagrid實現單行的上移下移及保存移動的結果,非常不錯，具有參考借鑒價值，需要的朋友可以參考下
2016-08-08
jQuery ztree實現動態(tài)樹形多選菜單
這篇文章主要介紹了jQuery ztree實現動態(tài)樹形多選菜單，ztree動態(tài)樹形菜單，初始化加載和延遲加載，感興趣的小伙伴們可以參考一下
2016-08-08
jQuery實現簡易的輸入框字數計數功能示例
這篇文章主要介紹了jQuery實現簡易的輸入框字數計數功能,結合實例形式分析了jQuery針對頁面元素屬性的獲取與計算相關操作技巧,需要的朋友可以參考下
2017-01-01
jQuery Validation Plugin驗證插件手動驗證
jquery.validate是jquery旗下的一個驗證框架，借助jquery的優(yōu)勢，我們可以迅速驗證一些常見的輸入,并且可以自己擴充自己的驗證方法，并且對國際化也有很好的支持，接下來通過本文給大家介紹jQuery Validation Plugin驗證插件手動驗證
2016-01-01
jQuery實現table隔行換色和鼠標經過變色的兩種方法
這篇文章主要介紹jQuery實現table隔行換色和鼠標經過變色的兩種方法,需要的朋友可以參考下
2014-06-06