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 ...
随机推荐
- Js中遇到的坑点汇总
一.Android 手机下输入框获取焦点时, 输入法挡住输入框的 bug 解决思路: 1.去掉overflow属性 2. Android 手机下, input 或 textarea 元素聚焦时, 主动 ...
- Spark脚本调用
Spark提供了多个脚本来作为程序的入口,其中最常用的是交互脚本 spark-shell, pyspark,还有spark sql的客户端spark-sql. 这些脚本最后都会归结到对SparkSub ...
- HDU-1358 Period 字符串问题 KMP算法 求最小循环节
题目链接:https://cn.vjudge.net/problem/HDU-1358 题意 给一个字符串,对下标大于2的元素,问有几个最小循环节 思路 对每个元素求一下minloop,模一下就好 提 ...
- 学习参考:《Python语言及其应用》中文PDF+英文PDF+代码
学习简单的数据类型,以及基本的数学和文本操作,学习用Python内置的数据结构来处理数据: 掌握Python的代码结构和函数的用法:使用模块和包编写大规模Python程序:深入理解对象.类和其他面向对 ...
- django 之数据库模块
前提ajango的 数据库主要是为了存取网站的一些内容,数据库的设置一般放在model.py 下 目录下 我们设置如下的数据库:具体的代码如下面所示: # -*- coding: utf-8 -* ...
- python购物车系统
购物车系统模拟:product_list = [ ('java',100), ('python',200), ('键盘',500), ('电脑',4000), ('mac Book',7000),]S ...
- spark rdd saveAsTextFile保存为文件
sc.parallelize(["one", "two", "two", "three", "three&qu ...
- AngularJs轻松入门(七)多视图切换
在AngularJs应用中,我们可以將html碎片写在一个单独的文件中,然后在其他页面中將该段碎片加载进来.如果有多个碎片文件,我们还可以在控制器中根据用户的操作动态的加载不同的碎片,从而达到切换视图 ...
- 最简单的UDP程序
最简单的UDP程序,一个负责发送消息,一个接收消息. 发送类: import java.io.IOException; import java.net.DatagramPacket; import j ...
- 基于JS的身份证验证(完整版)
var Wi = [ 7, 9, 10, 5, 8, 4, 2, 1, 6, 3, 7, 9, 10, 5, 8, 4, 2, 1 ]; // 加权因子 var ValideCode = [ 1, 0 ...