JS+JSP checkBox 全选具体实现


Posted in Javascript onJanuary 02, 2014
<script> 
function func(){ 
var options=document.getElementsByName("chkBox"); 
for (var i=0;i<options.length;i++){ 
if(!options[i].disabled){ 
options[i].checked=true; 
} 
} 
} 
</script> 
<input type=checkbox name=chkBox value=1 disabled> 
<input type=checkbox name=chkBox value=1> 
<input type=checkbox name=chkBox value=1> 
<input type=checkbox name=chkBox value=1> 
<input type=button value="测 试" onclick="func()">

用javascript吧。
<html> 
<body> 
<script> 
function kk(){ 
var handleEl = document.getElementById("kkHandler"); 
var els = document.getElementsByName("kk"); 
for(i=0;i<els.length;i++){ 
els[i].checked = handleEl.checked; 
} } 
</script> 
<input type=checkbox onclick="kk()" name="kkHandler">全选<br> 
<input type=checkbox name="kk"> 
<input type=checkbox name="kk"> 
</body> 
</html>

2:
<form name="form" ID="Form1"> 
<input type="checkbox" name="id" value="" ID="Checkbox1">1 
<input type="checkbox" name="id" value="" ID="Checkbox2">2 
<input type="checkbox" name="chose" value="" onclick="selectAll()" ID="Checkbox5">allselect 
</form> 
<script> 
function selectAll() 
{ 
if(!document.form.id.length){ 
if(document.form.chose.checked){ 
document.form.id.checked=true; 
} 
else{ 
document.form.id.checked=false; 
} 
} 
else{ 
for(var i=0;i<document.form.id.length;i++){ 
if(document.form.chose.checked){ 
document.form.id[i].checked=true; 
} 
else{ 
document.form.id[i].checked=false; 
} 
} 
} 
} 
</script>

3:
<input type='checkbox' name='info' value='a'> 
<input type='checkbox' name='info' value='b'> 
<input type='checkbox' name='info' value='c'> 
<input type='checkbox' name='info' value='d'> 
<input type='checkbox' name='info' value='e'><br> 
<input type='button' value =' 全选 'onclick='check_all();'> 
<script> 
function check_all(){ 
arr = document.getElementsByName('info'); 
for(i=0;i<arr.length;i++){ 
arr[i].checked = true; 
} 
} 
</script>
Javascript 相关文章推荐
文字溢出实现溢出的部分再放入一个新生成的div中具体代码
May 17 Javascript
JavaScript数组去重的两种方法推荐
Apr 05 Javascript
AngularJS ng-app 指令实例详解
Jul 30 Javascript
JavaScript中创建对象的7种模式详解
Feb 21 Javascript
详谈for循环里面的break和continue语句
Jul 20 Javascript
全选复选框JavaScript编写小结(附代码)
Aug 16 Javascript
jQuery实现的滑块滑动导航效果示例
Jun 04 jQuery
javascript数组常见操作方法实例总结【连接、添加、删除、去重、排序等】
Jun 13 Javascript
JavaScript复制变量三种方法实例详解
Jan 09 Javascript
vue-cli3项目升级到vue-cli4 的方法总结
Mar 19 Javascript
Node.js API详解之 os模块用法实例分析
May 06 Javascript
浅谈Web Storage API的使用
Jun 23 Javascript
使用js完成节点的增删改复制等的操作
Jan 02 #Javascript
js实现动态改变字体大小代码
Jan 02 #Javascript
js创建元素(节点)示例
Jan 02 #Javascript
JavaScript获取客户端计算机硬件及系统等信息的方法
Jan 02 #Javascript
新增加的内容是如何将div的scrollbar自动移动最下面
Jan 02 #Javascript
javascript中处理时间戳为日期格式的方法
Jan 02 #Javascript
JS脚本defer的作用示例介绍
Jan 02 #Javascript
You might like
PHP入门
2006/10/09 PHP
探讨:如何通过stats命令分析Memcached的内部状态
2013/06/14 PHP
总结PHP中DateTime的常用方法
2016/08/11 PHP
PHP实现多图上传(结合uploadify插件)思路分析
2016/11/30 PHP
Yii2 批量插入、更新数据实例
2017/03/15 PHP
一个对于Array的简单扩展
2006/10/03 Javascript
利用javascript/jquery对上传文件格式过滤的方法
2009/07/25 Javascript
jQuery实现用户注册的表单验证示例
2013/08/28 Javascript
js在输入框屏蔽按键,只能键入数字的示例代码
2014/01/03 Javascript
AngularJS中的Directive实现延迟加载
2016/01/25 Javascript
基于javascript实现最简单的选项卡切换效果
2016/05/16 Javascript
AngularJS 整理一些优化的小技巧
2016/08/18 Javascript
Angularjs 设置全局变量的方法总结
2016/10/20 Javascript
Select2.js下拉框使用小结
2016/10/24 Javascript
基于iScroll实现下拉刷新和上滑加载效果
2017/07/18 Javascript
jQuery完成表单验证的实例代码(纯代码)
2017/09/30 jQuery
JS获取一个表单字段中多条数据并转化为json格式
2017/10/17 Javascript
vue中使用echarts制作圆环图的实例代码
2018/07/27 Javascript
vue App.vue中的公共组件改变值触发其他组件或.vue页面监听
2019/05/31 Javascript
vue使用swiper实现左右滑动切换图片
2020/10/16 Javascript
在Python中封装GObject模块进行图形化程序编程的教程
2015/04/14 Python
举例讲解Python中的算数运算符的用法
2015/05/13 Python
python实现下载文件的三种方法
2017/02/09 Python
python实现list元素按关键字相加减的方法示例
2017/06/09 Python
python3+PyQt5+Qt Designer实现扩展对话框
2018/04/20 Python
tensorflow: 查看 tensor详细数值方法
2018/06/13 Python
wxPython的安装与使用教程
2018/08/31 Python
pytorch模型预测结果与ndarray互转方式
2020/01/15 Python
Windows上安装tensorflow  详细教程(图文详解)
2020/02/04 Python
同步和异步有何异同,在什么情况下分别使用他们
2013/04/09 面试题
手工社团活动方案
2014/02/17 职场文书
教室布置标语
2014/06/26 职场文书
2014年教师节活动总结
2014/08/29 职场文书
2014年幼儿园班级工作总结
2014/12/17 职场文书
2019年教师节祝福语精选,给老师送上真诚的祝福
2019/09/09 职场文书
CSS中使用grid布局实现一套模板多种布局
2022/07/15 HTML / CSS