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

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

这是代码


ios马甲包

1

2

3

4

5

6

7

8

5个回答

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

        <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);
}
});

weixin_38221608
buyax 谢谢大神,受教了
大约 3 年之前 回复
qq_36336328
qq_36336328 回复qq_36336328: periods就是nums忘记改回来了
大约 3 年之前 回复
qq_36336328
qq_36336328 复选框跟着变化 function allchk(){ var chknum = $("input[name = periods]").size();//选项总个数 var chk = 0; $("input[name = periods]:checkbox").each(function () { if($(this).is(":checked")){ chk++; } }); if(chknum==chk){//全选 $("#all").attr("checked",true); }else{//不全选 $("#all").attr("checked",false); } }
大约 3 年之前 回复

可以在复选框的前面加一个名称为全选的复选框,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的值
weixin_38221608
buyax 受教了~谢谢
大约 3 年之前 回复

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

weixin_38221608
buyax 好的
大约 3 年之前 回复

思路:如果全选的值为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);
    }
  };
zhangli2513
青珣墨笠 回复buyax: 你可以var 一个空数据 来保存得到的值 在把创建的数组传给后台就行
大约 3 年之前 回复
weixin_38221608
buyax 回复青珣墨笠: 对啊 选中的整合到一起传递到后台,可是你这个没标签,后台怎么获取啊
大约 3 年之前 回复
zhangli2513
青珣墨笠 回复buyax: 你是指选中的 数据吗?
大约 3 年之前 回复
weixin_38221608
buyax 大神,你的这个怎么获取全部的数据啊。我想要把他们传递到后台
大约 3 年之前 回复
Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
立即提问