您的位置：首页 > Web前端 > JavaScript

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

2018-02-06 18:57 501 查看

<!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" onclick="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>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航