js实现复选框的批量选中批量取消选中demo

最新推荐文章于 2020-01-09 17:22:35 发布

岳利-随笔

最新推荐文章于 2020-01-09 17:22:35 发布

阅读量921

点赞数

分类专栏：前端文章标签： javascript 前端全选复选框

本文链接：https://blog.csdn.net/qq_32725403/article/details/79261860

版权

前端专栏收录该内容

8 篇文章 0 订阅

订阅专栏

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb-2312">
<title>全选按钮demo</title>
<script language="javascript">
function selectall(){
var check =document.getElementsByName("check");
var len=check.length;
var idAll="";
var obj = document.getElementById("1");
var plsc = "批量删除";
var qxxz = "取消选中";
if(obj.value==plsc){
obj.value= qxxz;
for(var i=0;i<len;i++){
if(!check[i].checked){
check[i].checked=true;
}
if(check[i].checked){
idAll+=check[i].value+",";
}
}

}else if(obj.value==qxxz){
obj.value= plsc;

for(var i=0;i<len;i++){
if(check[i].checked){
check[i].checked=false;
}
idAll='';
}

}else{
alert("误操作");
}

}
</script>
</head>
<body>
<input type="button" value="批量删除" id="1" οnclick="selectall()"/>
<table>
<tr><td><input type="checkbox" value="1" name="check"/></td><td>111</td></tr>
<tr><td><input type="checkbox" value="2" name="check"/></td><td>22</td></tr>
<tr><td><input type="checkbox" value="3" name="check"/></td><td>33</td></tr>
<tr><td><input type="checkbox" value="4" name="check"/></td><td>44</td></tr>
<tr><td><input type="checkbox" value="5" name="check"/></td><td>55</td></tr>
</table>
</body>
</html>

岳利-随笔

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
js实现复选框的批量选中批量取消选中demo

全选按钮demo function selectall(){var check =document.getElementsByName("check");var len=check.length;var idAll="";var obj = document.getElementById("1");var plsc = "批量删除";var qxxz = "取消
复制链接

扫一扫

专栏目录