js中关于checkbox的一些操作

一、js根据字符串与checkbox的value值一样进行选中

var fieldStrValue="a,b,c,d,e,f,g";	//带有逗号的字符串
var names = fieldStrValue.split(",");   //获取的字符串转换为数组
var inputs = document.getElementsByClassName('checkbox-list');  //获取class为'checkbox-list'的input框
for (var i = 0; i < inputs.length; i++) {
    
        //循环遍历inputs
	for (var n = 0; n < names.length; n++) {
    
     //循环遍历names
		if (names[n] === inputs[i].value) {
    
       //对比如果names的值与inputs框的值一样
			inputs[i].checked = true;       //设置为checkbox选择
		}
    }
}

二、js全选checkbox以及取消全选操作

<!--全选操作-->
var checked = document.getElementsByClassName('checkbox-list');	//获取class为'checkbox-list'的input框
for (i = 0; i < checked.length; i++) {
    
    
	checked[i].checked = true;	//设置为所有的checkbox中checked的参数为true;
}

<!--取消全选操作-->
var checked = document.getElementsByClassName('checkbox-list');	//获取class为'checkbox-list'的input框
for (i = 0; i < checked.length; i++) {
    
    
	checked[i].checked = false;	//设置为所有的checkbox中checked的参数为false;
}

三、获取选中的checked的value值

let cbV = document.getElementsByClassName('checkbox-list');	//获取class为'checkbox-list'的input框
let cbarry = [];	//创建一个数组
for (i = 0; i < cbV.length; i++) {
    
    	//循环遍历cbv
	if (cbV[i].checked === true) {
    
    	//进行判断是否为选中
		cbarry.push(cbV[i].value);	//是选中的就取出value值放入cbarry数组中。
	}
}
console.log(cbarry);	//直接输出cbarry数组
console.log(cbarry.toString());	//cbarry数组转换为字符串输出