js实现全选、全不选、反选的功能
2024-09-14 20:01:59
<!DOCTYPE html>
<html>
<head>
<META charset="utf-8"/>
<link rel="stylesheet" href="table.css"/>
<style> </style>
</head>
<body>
爱好：<br/>
读书：<input type="checkbox" name="hobby" value="0"/><br/>
游泳：<input type="checkbox" name="hobby" value="1"/><br/>
听歌：<input type="checkbox" name="hobby" value="2"/><br/>
<hr/>
<button value="1" onclick="setAll()">全选</button>
<button value="0" onclick="setNo()">全不选</button>
<button value="-1" onclick="setOthers()" >反选</button>
</body>
<script src="util.js"></script>
<script>
/*
//全选函数
function setAll() {
var hobbies = document.getElementsByName("hobby");
for (var i = 0; i < hobbies.length; i++) {
hobbies[i].checked = true;
}
} //全不选函数
function setNo() {
var hobbies = document.getElementsByName("hobby");
for (var i = 0; i < hobbies.length; i++) {
hobbies[i].checked = false;
}
} //反选
function setOthers() {
var hobbies = document.getElementsByName("hobby");
for (var i = 0; i < hobbies.length; i++) {
if (hobbies[i].checked == false)
hobbies[i].checked = true;
else
hobbies[i].checked = false;
}
} */
var inputs=$('input[name=hobby]');
var btns=$('button');
for(var i=0;i<btns.length;i++){
btns[i].onclick=function(){
var value=this.getAttribute('value');
for(var i=0;i<inputs.length;i++){
if(value==1){
inputs[i].checked=true;
}else if(value==0){
inputs[i].checked=false;
}else{
inputs[i].checked=false;
}
}
}
} </script>
</html>
util.js
function $(n){
if(/^<([a-zA-Z]+)>$/.test(n)){
var tagName = RegExp.$1;
return document.createElement(tagName);
}else{
return document.querySelectorAll(n);
}
}
最新文章
- httpie 取代 curl
- Unity内存优化（贴图层面）
- php实现的笛卡儿积
- visual studio各个版本的差异
- JavaScript Table行定位效果
- Kafka入门学习（一）
- 教程：如何减小iOS应用程序的大小？
- 基于jQuery带图标的多级下拉菜单
- Android里viewpager切换页面存在页面不相邻的页面被销毁的问题
- [转] Splay Tree(伸展树)
- BZOJ 4513: [Sdoi2016]储能表 [数位DP ！]
- pyqt5 QGraphicsView颜色动画问题（不兼容，运行不了动画）
- PAT1042:Shuffling Machine
- Linux之防火墙管理篇[Ubuntu:ufw]
- PHP实现微信模板消息发送给指定用户
- IO流--与properties集合配合使用
- python字典按照value进行排序
- 浅谈java构建工具的选择
- TCP报文
- Centos/Fedora下安装Twisted，failed with error code 1 in /tmp/pip-build-H1bj8E/twisted/解决方法