javascript之复选框
来源:互联网 发布:人变老的软件 编辑:程序博客网 时间:2024/05/18 02:46
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script>
window.onload = function(){
selAll = document.getElementById("selAll");
hobbys = document.getElementsByName("hobby");
fx = document.getElementById("fx");
//全选事件
selAll.onclick = function(){
//全选
if(selAll.checked == true){
for(var i=0;i<hobbys.length;i++){
hobbys[i].checked = true;
}
}else{
for(var i=0;i<hobbys.length;i++){
hobbys[i].checked = false;
}
}
}
//反选
fx.onclick = function(){
for (var i=0;i<hobbys.length;i++) {
var b = hobbys[i];
if(b.checked == true){
b.checked = false;
}else{
b.checked = true;
}
}
}
}
</script>
</head>
<body>
<input type="checkbox" name="" id="selAll" />全选
<button id="fx">反选</button>
<br>
<input type="checkbox" name="hobby" />篮球
<input type="checkbox" name="hobby" />足球
<input type="checkbox" name="hobby" />乒乓球
<input type="checkbox" name="hobby" />羽毛球
<input type="checkbox" name="hobby" />排球
</body>
</html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script>
window.onload = function(){
selAll = document.getElementById("selAll");
hobbys = document.getElementsByName("hobby");
fx = document.getElementById("fx");
//全选事件
selAll.onclick = function(){
//全选
if(selAll.checked == true){
for(var i=0;i<hobbys.length;i++){
hobbys[i].checked = true;
}
}else{
for(var i=0;i<hobbys.length;i++){
hobbys[i].checked = false;
}
}
}
//反选
fx.onclick = function(){
for (var i=0;i<hobbys.length;i++) {
var b = hobbys[i];
if(b.checked == true){
b.checked = false;
}else{
b.checked = true;
}
}
}
}
</script>
</head>
<body>
<input type="checkbox" name="" id="selAll" />全选
<button id="fx">反选</button>
<br>
<input type="checkbox" name="hobby" />篮球
<input type="checkbox" name="hobby" />足球
<input type="checkbox" name="hobby" />乒乓球
<input type="checkbox" name="hobby" />羽毛球
<input type="checkbox" name="hobby" />排球
</body>
</html>
阅读全文
0 0
- javascript之复选框
- JavaScript 之复选框
- JavaScript之复选框的全选,全不选
- JavaScript的基础应用之复选框
- javascript复选框选择
- javascript复选框
- JavaScript单选框复选框
- Javascript复选框
- javaScript 案例之复选框的全选和取消
- JavaScript复选框相关函数
- javascript操作复选框函数
- JavaScript复选框的问题
- Javascript动态创建复选框
- javascript DOM 复选框选择
- JavaScript实现复选框全选
- JavaScript操作checkbox复选框
- 【JavaScript】DOM操作复选框
- javascript 按钮复选框选择
- Android Matrix详解
- 10、Selenium + Python 实现 UI 自动化测试-操作输入框
- 【Ethereum】以太坊ERC20与ERC233的区别
- codeforces 864D 模拟 + 贪心
- 《Hibernate学习笔记一》第一个程序的搭建
- javascript之复选框
- 合理使用 HTTP 缓存
- 使用java下载http形式的图片
- Spring boot 入门第一天Hello world
- C# 用正则表达式判断字符串是否全是数字、小数点、正负号组成等
- 52数学能力测评第一阶段线上模拟测评章程及使用说明
- Linux常用命令整理 (搭建ngnix+Fastdfs+redis+(集群版solr+zookeeper))后整的
- CentOS技术(5)--mysql数据库常用命令总结
- python工具