weixin_38221608
buyax
采纳率53.3%
2017-08-07 02:20

求助前端页面大神,复选框checkbox

15
已采纳

如题,我自己做了一个小项目,前端实在太渣,checkbox复选框这个怎么弄全选以及不全选啊,以及我想把选中的数据在页面弄成list或者数组传递到后台
这是图片,框架用的是easyUI
图片说明

这是代码


ios马甲包

1

2

3

4

5

6

7

8

  • 点赞
  • 写回答
  • 关注问题
  • 收藏
  • 复制链接分享
  • 邀请回答

5条回答

  • zhangli2513 青珣墨笠 4年前

    图片说明
    如果是选中的 你再这两个地方 console一下 他的value值就好

    点赞 评论 复制链接分享
  • qq_36336328 qq_36336328 4年前
            <input id="all" name="all" type="checkbox" value="-1" />全部
                <input id="nums1" name="nums" type="checkbox" value="1" />1
                <input id="nums2" name="nums" type="checkbox" value="2" />2
                <input id="nums3" name="nums" type="checkbox" value="3" />3
                <input id="nums4" name="nums" type="checkbox" value="4" />4
                <input id="nums5" name="nums" type="checkbox" value="5" />5
                <input id="nums6" name="nums" type="checkbox" value="6" />6
                <input id="nums7" name="nums" type="checkbox" value="7" />7
                <input id="nums8" name="nums" type="checkbox" value="8" />8
    

    $("#all").bind("click", function () {
    if(this.checked){
    $("input[name = nums]:checkbox").attr("checked", true);
    $("#all").attr("checked",true);
    }else{
    $("input[name = nums]:checkbox").attr("checked", false);
    $("#all").attr("checked",false);
    }
    });

    点赞 2 评论 复制链接分享
  • zhangli2513 青珣墨笠 4年前

    思路:如果全选的值为cheked即选中 遍历所有gam为checked 如果全选为null 遍历所有gam 为null;
    创建一个空变量num=0;遍历gam 选中一个 num++; 如果gam.length=num即全部选中 全选为checked
    打印在页面也是一样的 判断gam的 checked值 如果是选中的 输出到页面 样式自己随便设置

     <body>
            <input class="all" type="checkbox" value="全选"/>全选
            <input class="gam" type="checkbox" value="吃"/>吃
            <input class="gam" type="checkbox" value="喝"/>喝
            <input class="gam" type="checkbox" value="玩"/>玩
            <input class="gam" type="checkbox" value="乐"/>乐
        </body>
    
     var All=document.querySelector('.all');
    var gam=document.getElementsByClassName('gam');
    console.log(gam);
     All.onclick=function(){
        for(var i=0;i<gam.length;i++){
             if (this.checked){
                    gam[i].checked="checked";
                 } else{
                    gam[i].checked=null;
                 };
        };
        alert(All.value);
     };
     for(var x=0;x<gam.length;x++){
        gam[x].onclick=function(){
            var num=0;
           for(var j=0;j<gam.length;j++){ 
             if(gam[j].checked){
                num=num+1;
              }
             if(num<gam.length){All.checked=null}
             if(num==gam.length){All.checked='checked'}
           }
           alert(this.value);
        }
      };
    
    点赞 1 评论 复制链接分享
  • qq_23126581 郭老师的小迷弟雅思莫了 4年前

    前台有点像easyui。全选,反选,取消全选,这个你要用js去控制了。话说你这个不需要全选按钮吧,也就这几个选项,一个个点就是了,至于把选中的数据传入后台,这个你可以用ajax去异步操作。

    点赞 1 评论 复制链接分享
  • qq_35728177 Tsui丶 4年前

    可以在复选框的前面加一个名称为全选的复选框,js判断如果该复选框选中,改变此复选框后面的所有复选框状态为选中,取消选中相同。
    对于传值

    //点击传值的时候对数据进行处理
     function aa() {
    var bb = "";
    var temp = "";
    var a = document.getElementsByName("checkTheme");
    for ( var i = 0; i < a.length; i++) {
    if (a[i].checked) {
    temp = a[i].value;
    bb = bb + "," +temp;
    }
    }
    //bb即为处理后的字符串(“1,2,3,4,5,6,7,8”)
    }
    //action里面:
    private String tempString;//get、set方法
    String temp1[] = tempString.split(",");// 截取字符串,获得各个checkBox的值
    
    点赞 1 评论 复制链接分享

相关推荐