zoukankan      html  css  js  c++  java
  • 复选框实现

    <!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">
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <title>无标题文档</title>
    <head lang="en">
        <meta charset="UTF-8">
        <title></title>
        <script  src="jquery-3.0.0.min.js">    </script>
    <!--    <script type="text/javascript"></script>-->
            <script type="text/javascript">
            $(document).ready(function(){
           //var checkall2=document.getElementById("checkall");
            //var checkno2=document.getElementById("checkno");
            var checkss=$('#checkbox input');
            //alert(typeof(checkss));
            $('#checkall').click(function(){
                //alert("jjjj");
                for(var i=0;i<checkss.length;i++){
                if(!checkss.eq(i).is(':checked'));{
                checkss.eq(i).prop('checked',true);
                }
                }
                //checkss.attr('checked',true);
            });
            $('#checkno').click(function(){
                //alert('ss');
                for(var i=0;i<checkss.length;i++){
                if(checkss.eq(i).is(':checked'));{
                checkss.eq(i).prop('checked',false);
                }
                }
                
               // checkss.attr('checked',false);
            });
            });
            //注意:jquery1.7以上的版本用此方法只能第一次好用,第二次就会失效,需要把 checkss.eq(i).attr('checked', true);改为:checkss.eq(i).prop('checked',true);
            </script>
    
            
    
    </head>
    <body>
        <form id="form1">
            全选<input  id="checkall" type="button">
            全不选<input id="checkno"  type="button">
            <div id="checkbox">
                <input type="checkbox">3C
                <input type="checkbox">服饰
                <input type="checkbox">生活
                <input type="checkbox">视频
            </div>
        </form>
    </body>
    </html>
  • 相关阅读:
    mescroll vue tab页实现切换刷新列表
    路由权限配置
    js实现拖拽
    .eslintrc.js
    vue-cli项目中使用mock结合axios-mock-adapter生成模拟数据【转】
    原型模式
    设计模式简介
    @RequestParam @RequestBody @PathVariable 等参数绑定注解详解
    spring定时任务执行两次
    java反射--注解的定义与运用以及权限拦截
  • 原文地址:https://www.cnblogs.com/Aaron-dzl/p/5829325.html
Copyright © 2011-2022 走看看