js——全选框 checkbox
一直会碰见input 全选框的问题,先整理一种情况:
1.
<input id="selectAll" type="checkbox" />全选
2.
<input type='checkbox' id='id1' name='cb' value='1' />value1
<input type='checkbox' id='id2' name='cb' value='2' />value2
<input type='checkbox' id='id3' name='cb' value='3' />value3
3.
//全选框
jQuery(function () {
jQuery("#selectAll").click(function () { //全选
if (this.checked) {
jQuery("input[name='cb']").each(function () {
this.checked = true;
});
} else { //取消全选
jQuery("input[name='cb']").each(function () {
this.checked = false;
});
}
}
);
});
4.或者另外一种很简便的方法:
//全选框
jQuery(function () {
jQuery("#selectAll").click(function () { //全选
jQuery("input[name='cb']").attr("checked", true);
} else { //取消全选
jQuery("input[name='cb']").attr("checked", true);
}
}
);
});
同样,也是可以达到预期的效果。。。
js——全选框 checkbox的更多相关文章
- jquery、js全选反选checkbox
		
操作checkbox,全选反选 //全选 function checkAll() { $('input[name="TheID"]').attr("checked&quo ...
 - js 复选框 全选都选 如果某一个子复选框没选中 则全选按钮不选中
		
<!DOCTYPE HTML> <html> <head> <meta charset=UTF-8> <title>js 复选框 全选都选 ...
 - [原创]纯JS实现网页中多选复选框checkbox和单选radio的美化效果
		
图片素材: 最终效果图: <html><title> 纯JS实现网页中多选复选框checkbox和单选radio的美化效果</title><head>& ...
 - Js动态添加复选框Checkbox
		
Js动态添加复选框Checkbox的实例方法!!! 首先,使用JS动态产生Checkbox可以采用如下类似的语句: var checkBox=document.createElement(" ...
 - 2017 年 9 月 27 日 js(1.两个select 内容互换  2.单选按钮  同意可点击下一步 3. 全选框)
		
1.两个select 内容互换 <!DOCTYPE html><html> <head> <meta charset="UTF- ...
 - js 全选选框与取消全选代码
		
设置一个全选选框和四个子选框,要实现点击全选后四个子选框选中,取消全选后四个子选框也取消.全选后点击某个子选框,全选也能取消.当四个子选框都选中时,全选框也被选择. 实现代码: <script& ...
 - JS全选功能代码优化
		
原文:JS全选功能代码优化 JS全选功能代码优化 最近在看javascript MVC那本书,也感觉到自己写的代码也并不优雅,所以一直在想 用另一种模式来编写JS代码,所以针对之前的简单的JS全选功能 ...
 - vue实现全选框效果
		
vue实现全选框效果 一.总结 一句话总结: 全选的checkbox点击的时候判断这个checkbox的状态,如果没选中,说明下一个操作是选中所有 下面的每个checkbox判断一下是否所有的chec ...
 - 复选框(checkbox)、单选框(radiobox)的使用
		
复选框(checkbox).单选框(radiobox)的使用 复选框: HTML: // 复选框 <input type="checkbox" name="chec ...
 
随机推荐
- [SAP ABAP开发技术总结]文本文件、Excel文件上传下传
			
声明:原创作品,转载时请注明文章来自SAP师太技术博客( 博/客/园www.cnblogs.com):www.cnblogs.com/jiangzhengjun,并以超链接形式标明文章原始出处,否则将 ...
 - [Java解惑]应用
			
声明:原创作品,转载时请注明文章来自SAP师太技术博客( 博/客/园www.cnblogs.com):www.cnblogs.com/jiangzhengjun,并以超链接形式标明文章原始出处,否则将 ...
 - Python入门-行和缩进
			
学习Python与其他语言最大的区别就是,Python的代码块不使用大括号({})来控制类,函数以及其他逻辑判断.python最具特色的就是用缩进来写模块. 缩进的空白数量是可变的,但是所有代码块语句 ...
 - SQL——连接查询
			
以mysql为例: 新建两张表table1和table2 CREATE TABLE `table1` ( `id` ) NOT NULL auto_increment, `name` ) defaul ...
 - python_way ,day11 线程,怎么写一个多线程?,队列,生产者消费者模型,线程锁,缓存(memcache,redis)
			
python11 1.多线程原理 2.怎么写一个多线程? 3.队列 4.生产者消费者模型 5.线程锁 6.缓存 memcache redis 多线程原理 def f1(arg) print(arg) ...
 - kafka单节点部署无法访问问题解决
			
场景:在笔记本安装了一台虚拟机, 在本地的虚拟机上部署了一个kafka服务: 写了一个测试程序,在笔记本上运行测试程序,访问虚拟机上的kafka,报如下异常: 2015-01-15 09:33:26 ...
 - Android中四种OnClick事件的写法
			
package com.example.dailphone; import android.support.v7.app.ActionBarActivity; import android.suppo ...
 - linux使用脚本自动连接数据库
			
脚本名: mtest1.sh #!/bin/bash # test connecting to the Mysql server MYSQL=`which mysql` $MYSQL test -u ...
 - 在.bashrc文件中定义函数
			
在命令行上直接定义shell函数的明显缺点是当退出shell时,函数就消失了,对于复杂的函数来说,这可能会是个问题. 一个简单的方法就是每次启动新shell的时候都会自动加载所需要的函数. 最好的办法 ...
 - iOS开发之 Xcode 6 创建一个Empty Application
			
参考链接http://jingyan.baidu.com/article/2a138328bd73f2074b134f6d.html Xcode 6 正式版如何创建一个Empty Applicatio ...