复制代码 代码如下:
<SPAN style="FONT-SIZE: 14px"><!DOCTYPE html>
<html>
<head>
<title>复选框处理.html</title>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
</head>
<body>
<input type="checkbox" id="checkItem">全选/全不选
<br>
<h3>爱好</h3>
<input type="checkbox" name="item">看书
<br>
<input type="checkbox" name="item">听音乐
<br>
<input type="checkbox" name="item">打球
<br>
<input type="checkbox" name="item">散步
<br>
<input type="checkbox" name="item">写代码
<br>
<script>
window.onload = function(){
var checkItem = document.getElementById("checkItem").onclick = function(){
var itemsElement = document.getElementsByName("item");
for (var i = 0; i < itemsElement.length; i++) {
var itemElement = itemsElement[i];
if (this.checked) {
itemElement.checked = "checked";
}
else {
itemElement.checked = null;
}
}
}
}
</script>
</body>
</html>
</SPAN>
<SPAN style="FONT-SIZE: 14px"><!DOCTYPE html>
<html>
<head>
<title>复选框处理.html</title>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
</head>
<body>
<input type="checkbox" id="checkItem">全选/全不选
<br>
<h3>爱好</h3>
<input type="checkbox" name="item">看书
<br>
<input type="checkbox" name="item">听音乐
<br>
<input type="checkbox" name="item">打球
<br>
<input type="checkbox" name="item">散步
<br>
<input type="checkbox" name="item">写代码
<br>
<script>
window.onload = function(){
var checkItem = document.getElementById("checkItem").onclick = function(){
var itemsElement = document.getElementsByName("item");
for (var i = 0; i < itemsElement.length; i++) {
var itemElement = itemsElement[i];
if (this.checked) {
itemElement.checked = "checked";
}
else {
itemElement.checked = null;
}
}
}
}
</script>
</body>
</html>
</SPAN>
标签:
复选框,全选,全不选
免责声明:本站文章均来自网站采集或用户投稿,网站不提供任何软件下载或自行开发的软件!
如有用户或公司发现本站内容信息存在侵权行为,请邮件告知! 858582#qq.com
桃源资源网 Design By www.nqtax.com
暂无“复选框全选与全不选操作实现思路”评论...