js实现复选框的操作-------Day41
不知道之前的一篇为什么一直处于审核阶段。难道有哪个词语是敏感词被河蟹了?
无论了,又一次写了这篇,也算是加深记忆吧。
首先要写的是今天在进行表格数据操作时用到的对复选框checkbox的全选和全不选,首先来编写下html语言
<table>
<thead>
<tr>
<td><input type="checkbox" id="sall" onchange="changeAll()"></td>
</tr>
</thead>
<tbody>
<tr>
<td><input type="checkbox" name="each" value="1"></td>
</tr>
<tr>
<td><input type="checkbox" name="each" value="2"></td>
</tr>
<tr>
<td><input type="checkbox" name="each" value="3"></td>
</tr>
<tr>
<td><input type="checkbox" name="each" value="4"></td>
</tr>
</tbody>
</table>
来写一下从网上搜罗后终于实现的比較简单明了的写法。比自己写的好了不止一倍啊
function changeAll(){
var sall=document.getElementById("sall");//获取标题栏中的操作对象
var seach=document.getElementsByName("each");//获取内容栏的对象
for(var i=0;i<seach.length;i++){
if (sall.checked) {
seach[i].checked=true;
}else{
seach[i].checked=false;
}
}
}
来分析下它的实现方法,比自己写的果断要好了不少,自己当时採取了两种方法,可是远不如这个成型的简单介绍明了。自己的全用id来操作确实又臭又长了。
对复选框的操作还有比較常见的复选框。就上面这个样例来的话。我们来实现下:onchange="change()"
function change(){
var seach=document.getElementsByName("each");
for(var i=0;i<seach.length;i++){
seach[i].checked=!seach[i].checked;
}
}
最后。对复选框的最经常使用的就是获取某一列的信息,从而实现传值。这里我们来获取下值:
var seach=document.getElementsByName("each");
for(var i=0;i<seach.length;i++){
if(seach[i].checked){
alert(seach[i].value);
}
}
不知道自己到底坚持的是什么了。这样又一次编写一遍的话,效果上来说,实在没有第一遍来的那么好。无论那么多了,加油吧,菜鸟飞飞飞....
js实现复选框的操作-------Day41的更多相关文章
- html+css+js实现复选框全选与反选
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/ ...
- js实现复选框的全选、全不选和反选
js实现复选框的全选.全不选和反选 主要是用遍历的方法查找元素,然后通过改变checked的属性来选择,为true则是选中状态,为false则是未选状态 实现代码 <!DOCTYPE html& ...
- js input复选框选中父级同时子级也选中
js实现复选框选中父级元素子级元素也选中,没有子级元素选中父级也不选中的效果 HTML <tr> <td> <label> <input name=" ...
- selenium--单选框和复选框的操作
单选框操作 from selenium import webdriver import unittest class Test_radio(unittest.TestCase): def test_S ...
- js实现复选框全选/全不选/反选
js实现复选框全选/全不选/反选 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "h ...
- js实现复选框的全选、全不选、反选
js中实现复选框的全选,全不选以及反选,分为两种情况: (1)选中“请选择”前面的复选框实现全选,不选中“请选择”前面的复选框实现全不选 <!DOCTYPE html PUBLIC " ...
- js 判断 复选框全选、全不选、反选、必选一个
一个挺 使用的 js 代码片段, 判断 复选框全选.全不选.反选.必选一个 记录下, 搬来的 思路: 修改数据的 选中与否状态, 拿到所有的输入框,看是否有选中的状态 <html> & ...
- 使用js获取复选框的值,并把数组传回后台处理,过程使用的是Ajax异步查询
这是界面代码: function shua(){ var id_array=new Array(); $('input[id="checkAll& ...
- 复选框全选、反选及根据值JS控制复选框默认选中事件
HTML代码 <div class="col-sm-7"> <input type="checkbox" id="allAndNot ...
随机推荐
- lsof 命令简介
losf 命令可以列出某个进程打开的所有文件信息.打开的文件可能是普通的文件,目录,NFS文件,块文件,字符文件,共享库,常规管道,明明管道,符号链接,Socket流,网络Socket,UNIX域So ...
- 【AnjularJS系列1 】— 样式相关的指令
最近,开始学习AngularJS. 开始记录学习AngularJS的过程,从一些很简单的知识点开始. 习惯先从实际应用的指令开始,再从应用中去体会AngularJS的优缺点.使用的场景等. 之前一直希 ...
- CentOS7-1810 系统DNS服务器BIND软件配置说明
DNS的出现的历史 网络出现的早期是使用IP地址通讯的,那时就几台主机通讯.但是随着接入网络主机的增多,这种数字标识的地址非常不便于记忆,UNIX上就出现了建立一个叫做hosts的文件(Linux和W ...
- document.body
比如document.body,最好是写成document.getElementsByTagName("body")[0];
- luogu P1375 小猫(卡特兰数)
题意 (n<=200000) 题解 把DP转移方程写出来,这不是卡特兰数吗?然后就解决了. 做完这题我发现 DP真是一个好东西. (公式连乘所以中间要加mod要不爆longlong了) #inc ...
- BZOJ 2342 [Shoi2011]双倍回文(manacher+堆+set)
题意 N<=500000 题解 维护一个set可以用堆来解决. #include<iostream> #include<cstring> #include<cstd ...
- 关于vue事件监听的一个问题
由于新工作需要用vue,所以最近接触最多的也是vue,因为之前一直在用react,所以对于vue上手还是很快的.我也尽量找一些他们两个的异同点,除了多了一些辅助用的方法以外,最大的不同应该是对于组件间 ...
- hadoop-10-创建yum资源库
hadoop-10-创建yum资源库 1,在/etc/yum.repos.d/下面创建 ambari.repo HDP.repo HDP-UTILS.repo 三个文件: [root@server ...
- hdoj 3376,2686 Matrix Again 【最小费用最大流】
题目:hdoj 3376 Matrix Again 题意:给出一个m*n的矩阵,然后从左上角到右下角走两次,每次仅仅能向右或者向下,出了末尾点其它仅仅能走一次,不能交叉,每次走到一个格子拿走这个格子中 ...
- 浅析为什么 char 类型的范围是 : -128~+127
在 C 语言中. signed char 类型的范围为 -128~127,每本教科书上也这么写.可是没有哪一本书上(包含老师)也不会给你为什么是 -128~127,这个问题貌似看起来也非常easyea ...