jquery操作checkbox示例分享


Posted in Javascript onJuly 21, 2014

checkbox操作

1. 全选、全不选

2.打印所有的选中项目

jquery操作checkbox示例分享

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <head>
 <title> </title>
 <script type="text/javascript" src="jquery-1.3.2.js"></script>
 <script>
 // 全选、全不选
 function docChkBoxChange(){
  var isChecked = jQuery('#docChkBoxTop').attr('checked');
  // 设置以下所有的 checkBox 列表
  jQuery("input[name=docChkBox]").each(function(){
  this.checked = isChecked;
  });
 }//end function
 // 打印所有的选中项目
 function printChoose(){
  var isChecked = jQuery('#docChkBoxTop').attr('checked');
  // 设置以下所有的 checkBox 列表
  jQuery("input[name=docChkBox]").each(function(){
  if(this.checked){
  alert(this.value)
  }
  });
 }//end function
 </script>
 </head>

 <body>
 <table>
 <tr>
 <td>
  <input id='docChkBoxTop' type="checkbox" onClick='docChkBoxChange()'>全选、全不选
 </td>
 </tr>
 <tr>
 <td>
  <input name='docChkBox' type="checkbox" value='apple'>苹果
 </td>
 </tr>
 <tr>
 <td>
  <input name='docChkBox' type="checkbox" value='banana'>香蕉
 </td>
 </tr>
 
 <tr>
 <td>
  <input type="button" value='打印所有选中项' onClick='printChoose()'>
 </td>
 </tr>
 </table>
 </body>
</html>
Javascript 相关文章推荐
javascript 树控件 比较好用
Jun 11 Javascript
xml 封装与解析(javascript和C#中)
Jul 26 Javascript
禁止IE用右键的JS代码
Dec 30 Javascript
JS实现简洁、全兼容的拖动层实例
May 13 Javascript
AngularJS指令与控制器之间的交互功能示例
Dec 14 Javascript
canvas绘制万花筒效果(代码分享)
Jan 20 Javascript
详解angularJs指令的3种绑定策略
Apr 13 Javascript
Dropify.js图片宽高自适应的方法
Nov 27 Javascript
浅谈js获取ModelAndView值的问题
Mar 28 Javascript
vue脚手架搭建项目的兼容性配置详解
Jul 17 Javascript
vue.js引入外部CSS样式和外部JS文件的方法
Jan 06 Javascript
vue-cropper组件实现图片切割上传
May 27 Vue.js
jquery常用操作小结
Jul 21 #Javascript
JavaScript中的apply和call函数详解
Jul 20 #Javascript
一行命令搞定node.js 版本升级
Jul 20 #Javascript
JavaScript中的原型和继承详解(图文)
Jul 18 #Javascript
JavaScript中伪协议 javascript:使用探讨
Jul 18 #Javascript
js清空表单数据的两种方式(遍历+reset)
Jul 18 #Javascript
js使用正则实现ReplaceAll全部替换的方法
Jul 18 #Javascript
You might like
地球防卫队:陪着奥特曼打小怪兽的人类力量 那些经典队服
2020/03/08 日漫
一些花式咖啡的配方
2021/03/03 冲泡冲煮
php根据分类合并数组的方法实例详解
2013/11/06 PHP
php使用curl访问https示例分享
2014/01/17 PHP
Thinkphp中Create方法深入探究
2014/06/16 PHP
ThinkPHP处理Ajax返回的方法
2014/11/22 PHP
深入浅析PHP无限极分类的案例教程
2016/05/09 PHP
thinkphp框架类库扩展操作示例
2019/11/26 PHP
javascript生成/解析dom的CDATA类型的字段的代码
2007/04/22 Javascript
兼容ie和firefox js关闭代码
2008/12/11 Javascript
ASP小贴士/ASP Tips javascript tips可以当桌面
2009/12/10 Javascript
jquery获取select,option所有的value和text的实例
2017/03/06 Javascript
js数据类型检测总结
2018/08/05 Javascript
Vue-component全局注册实例
2018/09/06 Javascript
小程序实现多列选择器
2019/02/15 Javascript
简单了解微信小程序的目录结构
2019/07/01 Javascript
JS扁平化输出数组的2种方法解析
2019/09/17 Javascript
JavaScript语法约定和程序调试原理解析
2020/11/03 Javascript
element中Steps步骤条和Tabs标签页关联的解决
2020/12/08 Javascript
Python脚本实现集群检测和管理功能
2015/03/06 Python
Python验证码识别的方法
2015/07/10 Python
浅谈Python由__dict__和dir()引发的一些思考
2017/10/30 Python
PyQt5每天必学之进度条效果
2018/04/19 Python
Python2.7.10以上pip更新及其他包的安装教程
2018/06/12 Python
浅谈Python的list中的选取范围
2018/11/12 Python
python实现栅栏加解密 支持密钥加密
2019/03/20 Python
Python 获取 datax 执行结果保存到数据库的方法
2019/07/11 Python
基于 Django 的手机管理系统实现过程详解
2019/08/16 Python
Cult Gaia官网:美国生活方式品牌
2019/08/16 全球购物
CLR与IL分别是什么含义
2016/08/23 面试题
OSPF有什么优点?为什么OSPF比RIP收敛快?
2013/02/13 面试题
《故都的秋》教学反思
2014/04/15 职场文书
优秀团干部个人事迹
2014/05/29 职场文书
公务员年终个人总结
2015/02/12 职场文书
毕业论文答辩开场白和答辩技巧
2015/05/27 职场文书
如何理解Vue简单状态管理之store模式
2021/05/15 Vue.js