zoukankan      html  css  js  c++  java
  • jQuery-实现全选与反选

    <!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>用iQuery实现全选与反选</title>
    </head>
     <!--script src="1、jquery实现图片轮播示例/js/jquery-1.11.3/jquery.min.js"></script-->
     <script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
     <script type="text/javascript">
       $(document).ready(function() {
           
         $("#checkedAll").click(function(){
             
              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="checkboxAll" id="checkedAll"/>全选/取消全选
    </body>
    </html>
  • 相关阅读:
    ui、li模拟下拉框
    六项精进
    Echarts柱状图添加点击事件
    [UWP]爱恋动漫BT开发小记
    [杂谈]这个四月
    [uwp]自定义图形裁切控件
    [uwp]自定义Behavior之随意拖动
    [uwp]数据绑定再学习
    [mvc]记一次“项目”的历程
    [uwp]ImageSource和byte[]相互转换
  • 原文地址:https://www.cnblogs.com/newcapecjmc/p/7994182.html
Copyright © 2011-2022 走看看