javascript实现checkBox的全选,反选与赋值_javascript技巧
程序员文章站
2022-04-19 21:19:29
...
我们平时在做项目的时候,经常会遇到需要实现实现checkBox的全选,反选与赋值的情况,网上也有许多的范例,这里给大家分享的是本人常用的方法,推荐给大家。
//js 数值是否在数组中
Array.prototype.in_array = function(e){
for(i=0;i
if(this[i] == e)
return true;
}
return false;
}
//js数组index
Array.prototype.find_str=function(string){
var str = this.join("");
return str.indexOf(string);
}
var houseIds=new Array();
$("#chebox-list-all").click(function(){
if($("#chebox-list-all").attr("checked")){
$("[name='checkboxes']").attr("checked",'true');//全选 增加id
var ids = document.getElementsByName('checkboxes');
var value = new Array();
for(var i = 0; i if(ids[i].checked)
houseIds.push(ids[i].value);
}
alert(houseIds);
}else{
$("[name='checkboxes']").removeAttr("checked");//反选 删除Ids
houseIds=[];
alert(houseIds);
}
})
//单选增加id
function check(obj){
if(!houseIds.in_array(obj.value)){
houseIds.push(obj.value);
alert(houseIds);
}else{
var index=houseIds.find_str(obj.value);
houseIds.splice(index, 1)
alert(houseIds);
}
}
复制代码 代码如下:
//js 数值是否在数组中
Array.prototype.in_array = function(e){
for(i=0;i
return true;
}
return false;
}
//js数组index
Array.prototype.find_str=function(string){
var str = this.join("");
return str.indexOf(string);
}
var houseIds=new Array();
$("#chebox-list-all").click(function(){
if($("#chebox-list-all").attr("checked")){
$("[name='checkboxes']").attr("checked",'true');//全选 增加id
var ids = document.getElementsByName('checkboxes');
var value = new Array();
for(var i = 0; i if(ids[i].checked)
houseIds.push(ids[i].value);
}
alert(houseIds);
}else{
$("[name='checkboxes']").removeAttr("checked");//反选 删除Ids
houseIds=[];
alert(houseIds);
}
})
//单选增加id
function check(obj){
if(!houseIds.in_array(obj.value)){
houseIds.push(obj.value);
alert(houseIds);
}else{
var index=houseIds.find_str(obj.value);
houseIds.splice(index, 1)
alert(houseIds);
}
}
以上就是本示例的全部代码了,希望对大家学习使用javascript控制checkbox有所帮助。
推荐阅读
-
纯javascript实现选择框的全选与反选功能
-
纯javascript实现选择框的全选与反选
-
Javascript实现CheckBox的全选与取消全选的代码
-
jquery、js操作checkbox全选反选_javascript技巧
-
javascript实现checkbox全选的代码_javascript技巧
-
用RadioButten或CheckBox实现div的显示与隐藏_javascript技巧
-
实现checkbox全选、反选、取消JavaScript小脚本异常_javascript技巧
-
复选框全选与全不选操作实现思路_javascript技巧
-
js操作CheckBoxList实现全选/反选(在客服端完成)_javascript技巧
-
jquery、js操作checkbox全选反选_javascript技巧