jquery實(shí)現(xiàn)全選和全不選功能效果的實(shí)現(xiàn)代碼【推薦】

更新時(shí)間：2016年05月05日 16:58:53 投稿：jingxian

下面小編就為大家?guī)硪黄猨query實(shí)現(xiàn)全選和全不選功能效果的實(shí)現(xiàn)代碼【推薦】。小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考

網(wǎng)上好多代碼都是錯(cuò)的

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>jquery實(shí)現(xiàn)全選和全不選功能效果的實(shí)現(xiàn)代碼【推薦】</title>
</head>
<script src="jquery-1.7.1.min.js"></script>
<script type="text/javascript">
  $(document).ready(function () {

    $("#checkedAll").click(function () {

      //alert("aa");


      if ($(this).attr("checked")) { // 全選 

        $("input[name='checkbox_name']").each(function () {
          $(this).attr("checked", true);
        });
      }
      else { // 取消全選 

        $("input[name='checkbox_name']").each(function () {
          $(this).attr("checked", false);
        });
      }
    });

  }); 

</script> 

<body>
<input type="checkbox" name="checkbox_name" id="checkbox_name_1" />1<br />
<input type="checkbox" name="checkbox_name" id="checkbox_name_2" />2<br />
<input type="checkbox" name="checkbox_name" id="checkbox_name_3" />3<br />
<input type="checkbox" name="checkbox_name" id="checkbox_name_4" />4<br />
<input type="checkbox" name="checkedAll" id="checkedAll"/>全選/取消全選
</body>
</html>

以上這篇jquery實(shí)現(xiàn)全選和全不選功能效果的實(shí)現(xiàn)代碼【推薦】就是小編分享給大家的全部內(nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。

您可能感興趣的文章:

相關(guān)文章

使用jQuery制作浮動(dòng)工具欄的實(shí)例分享
這里所說的浮動(dòng)工具欄就是大家平時(shí)看到的社交網(wǎng)絡(luò)分享按鈕欄那樣的效果,可以做成浮動(dòng)效果且能上下移動(dòng),這里我們就來看一個(gè)使用jQuery制作頁面工具邊欄的實(shí)例分享.
2016-05-05
jQuery實(shí)現(xiàn)簡單彈出框效果實(shí)例
這篇文章主要給大家介紹了關(guān)于jQuery實(shí)現(xiàn)簡單彈出框效果的相關(guān)資料,幾天一直在研究JQuery,確實(shí)很好用,有很多需求都是要彈出框,文中通過實(shí)例代碼介紹的非常詳細(xì),需要的朋友可以參考下
2023-06-06
jQuery實(shí)現(xiàn)隔行背景色變色
這篇文章給大家分享了jQuery實(shí)現(xiàn)隔行背景色變色的代碼，有相同需要的小伙伴參考下吧
2014-11-11
jquery如何實(shí)現(xiàn)在加載完iframe的內(nèi)容后再進(jìn)行操作
怎么實(shí)現(xiàn)在加載完iframe的內(nèi)容后才進(jìn)行下一步操作，通過jquery可以實(shí)現(xiàn)，為iframe添加onload事件，具體如下，喜歡的朋友不妨參考下或許對大家有所幫助
2013-09-09
jquery插件開發(fā)之實(shí)現(xiàn)md5插件
這篇文章主要介紹了jquery開發(fā)實(shí)現(xiàn)的md5插件，最后返回的是一串十進(jìn)制數(shù)，在jquery1.9.2下測試通過,需要的朋友可以參考下
2014-03-03
JQuery中兩個(gè)ul標(biāo)簽的li互相移動(dòng)實(shí)現(xiàn)方法
這篇文章主要介紹了JQuery中兩個(gè)ul標(biāo)簽的li互相移動(dòng)實(shí)現(xiàn)方法,可實(shí)現(xiàn)ul標(biāo)簽中l(wèi)i標(biāo)簽內(nèi)容相互替換的技巧,涉及jQuery操作頁面元素的相關(guān)技巧,需要的朋友可以參考下
2015-05-05
jQuery插件開發(fā)發(fā)送短信倒計(jì)時(shí)功能代碼
最近項(xiàng)目開發(fā)中遇到這樣的功能:1.點(diǎn)擊按鈕的時(shí)候，可以進(jìn)行倒計(jì)時(shí)，倒計(jì)時(shí)自定義.2.當(dāng)接收短信失敗后，倒計(jì)時(shí)停止，可點(diǎn)擊重新發(fā)送短信.3.點(diǎn)擊的元素支持一般標(biāo)簽和input標(biāo)簽?？此坪軓?fù)雜其實(shí)實(shí)現(xiàn)代碼很簡單，下面小編給大家分享下實(shí)現(xiàn)代碼，需要的朋友參考下吧
2017-05-05
jQuery ajax全局函數(shù)處理session過期后的ajax跳轉(zhuǎn)問題
這篇文章主要介紹了基于jQuery的全局ajax函數(shù)處理session過期后的ajax操作的相關(guān)資料,需要的朋友可以參考下
2016-06-06
jQuery插件HighCharts繪制2D帶有Legend的餅圖效果示例【附demo源碼下載】
這篇文章主要介紹了jQuery插件HighCharts繪制2D帶有Legend的餅圖效果,結(jié)合實(shí)例形式分析了jQuery使用HighCharts繪制帶明細(xì)顯示的餅狀圖效果實(shí)現(xiàn)技巧,并附帶了demo源碼供讀者下載參考,需要的朋友可以參考下
2017-03-03
jQuery EasyUI API 中文文檔 - TimeSpinner時(shí)間微調(diào)器
jQuery EasyUI API 中文文檔 - TimeSpinner時(shí)間微調(diào)器介紹，需要的朋友可以參考下。
2011-10-10