不知道之前的一篇为什么一直处于审核阶段。难道有哪个词语是敏感词被河蟹了?

无论了,又一次写了这篇,也算是加深记忆吧。

首先要写的是今天在进行表格数据操作时用到的对复选框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的更多相关文章

  1. html+css+js实现复选框全选与反选

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/ ...

  2. js实现复选框的全选、全不选和反选

    js实现复选框的全选.全不选和反选 主要是用遍历的方法查找元素,然后通过改变checked的属性来选择,为true则是选中状态,为false则是未选状态 实现代码 <!DOCTYPE html& ...

  3. js input复选框选中父级同时子级也选中

    js实现复选框选中父级元素子级元素也选中,没有子级元素选中父级也不选中的效果 HTML <tr> <td> <label> <input name=" ...

  4. selenium--单选框和复选框的操作

    单选框操作 from selenium import webdriver import unittest class Test_radio(unittest.TestCase): def test_S ...

  5. js实现复选框全选/全不选/反选

    js实现复选框全选/全不选/反选 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "h ...

  6. js实现复选框的全选、全不选、反选

    js中实现复选框的全选,全不选以及反选,分为两种情况: (1)选中“请选择”前面的复选框实现全选,不选中“请选择”前面的复选框实现全不选 <!DOCTYPE html PUBLIC " ...

  7. js 判断 复选框全选、全不选、反选、必选一个

    一个挺 使用的 js 代码片段,  判断  复选框全选.全不选.反选.必选一个 记录下, 搬来的 思路: 修改数据的 选中与否状态, 拿到所有的输入框,看是否有选中的状态 <html> & ...

  8. 使用js获取复选框的值,并把数组传回后台处理,过程使用的是Ajax异步查询

    这是界面代码: ​ function shua(){             var id_array=new Array();         $('input[id="checkAll& ...

  9. 复选框全选、反选及根据值JS控制复选框默认选中事件

    HTML代码 <div class="col-sm-7"> <input type="checkbox" id="allAndNot ...

随机推荐

  1. lsof 命令简介

    losf 命令可以列出某个进程打开的所有文件信息.打开的文件可能是普通的文件,目录,NFS文件,块文件,字符文件,共享库,常规管道,明明管道,符号链接,Socket流,网络Socket,UNIX域So ...

  2. 解决IIS服务器部署 字体图标找不到的原因

    引言 我们往往在IIS上部署Web项目,或者发布Web项目的时候,经常会遇到浏览器找不到字体文件(woff/woff2)产生的错误.这样会导致浏览器无法加载字体图标,在影响加载时间的同时,更无法显示对 ...

  3. 捕捉soap的xml形式

    下面是我以前对Php的soap接口进行抓包分析出的结果,这个分析在当服务端或者客户端的Php没有安装soap模块时,可以使用构建xml的方式实现相同的功能 服务端: $data = $HTTP_RAW ...

  4. BZOJ 3129 [SDOI2013]方程 (拓展Lucas)

    题目大意:给定一个方程$X_{1}+X_{2}+X_{3}+X_{4}+...+X_{n}=M$,$\forall X_{i}<=A_{i} (i<=n1)$ $\forall X_{i} ...

  5. redhat 7 cenos 7 网络配置文件

    Cenos 7 TYPE=Ethernet PROXY_METHOD=none BROWSER_ONLY=no DEFROUTE=yes IPV4_FAILURE_FATAL=no NAME=eth0 ...

  6. 虚拟机virtualbox,直接复制本机虚拟硬盘vdi使用, 会提示错误的解决方法

    提示语句为: 打开硬盘文件D:\Virtualbox\debian9 - 副本.vdi 失败. 明细(D) Cannot register the hard disk ‘D:\Virtualbox\d ...

  7. 洛谷 P3924 康娜的线段树

    P3924 康娜的线段树 题目描述 小林是个程序媛,不可避免地康娜对这种人类的“魔法”产生了浓厚的兴趣,于是小林开始教她OI. 今天康娜学习了一种叫做线段树的神奇魔法,这种魔法可以维护一段区间的信息, ...

  8. EEPlat PaaS中的多租户数据隔离模式

    EEPlat PaaS支持三种租户的数据隔离技术:Sparce Column.tenantId字段隔离.每一个租户独立数据库. 1)Sparce Column,和Salesforce Appforce ...

  9. Step by Step Do IOS Swift CoreData Simple Demo

    简单介绍 这篇文章记录了在 IOS 中使用 Swift 操作 CoreData 的一些基础性内容,因为缺乏文档,基本上都是自行实验的结果.错漏不可避免,还请谅解. 部分内容借鉴了 Tim Roadle ...

  10. LightOJ Trailing Zeroes (III) 1138【二分搜索+阶乘分解】

    1138 - Trailing Zeroes (III) PDF (English) problem=1138" style="color:rgb(79,107,114)" ...