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 相关文章推荐
Jquery动态替换div内容及动态展示的方法
Jan 23 Javascript
jQuery跨域问题解决方案
Aug 03 Javascript
jQuery实现平滑滚动的标签分栏切换效果
Aug 28 Javascript
DWR中各种java方法的调用
May 04 Javascript
Vue组件tree实现树形菜单
Apr 13 Javascript
关于Ajax的原理以及代码封装详解
Sep 08 Javascript
vue-自定义组件传值的实例讲解
Sep 18 Javascript
详解处理Vue单页面应用SEO的另一种思路
Nov 09 Javascript
服务端预渲染之Nuxt(使用篇)
Apr 08 Javascript
Vue起步(无cli)的啊教程详解
Apr 11 Javascript
element中的$confirm的使用
Apr 26 Javascript
js实现贪吃蛇游戏 canvas绘制地图
Sep 09 Javascript
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
解析PHP 5.5 新特性
2013/07/02 PHP
使用 PHPStorm 开发 Laravel
2015/03/24 PHP
实例分析PHP中PHPMailer发邮件
2017/12/13 PHP
PHP使用glob方法遍历文件夹下所有文件的实例
2018/10/17 PHP
php curl发送请求实例方法
2019/08/01 PHP
alixixi runcode.asp的代码不错的应用
2007/08/08 Javascript
javascript[js]获取url参数的代码
2007/10/17 Javascript
html5的自定义data-*属性和jquery的data()方法的使用示例
2013/08/21 Javascript
多种方法实现360浏览器下禁止自动填写用户名密码
2014/06/16 Javascript
浅析JavaScript声明变量
2015/12/21 Javascript
jquery模拟多级复选框效果的简单实例
2016/06/08 Javascript
JavaScript利用正则表达式替换字符串中的内容
2016/12/12 Javascript
简单实现AngularJS轮播图效果
2020/04/10 Javascript
基于Vue实现图书管理功能
2017/10/17 Javascript
深入了解JavaScript代码覆盖
2019/06/13 Javascript
vue+iview使用树形控件的具体使用
2020/11/02 Javascript
python随机生成指定长度密码的方法
2015/04/04 Python
python数组过滤实现方法
2015/07/27 Python
TensorFlow高效读取数据的方法示例
2018/02/06 Python
解决Python3中的中文字符编码的问题
2018/07/18 Python
WIn10+Anaconda环境下安装PyTorch(避坑指南)
2019/01/30 Python
Python二叉搜索树与双向链表转换算法示例
2019/03/02 Python
利用Python自动化操作AutoCAD的实现
2020/04/01 Python
Python控制台实现交互式环境执行
2020/06/09 Python
H5新属性audio音频和video视频的控制详解(推荐)
2016/12/09 HTML / CSS
英语师范专业毕业生自荐信
2013/09/21 职场文书
《蓝色的树叶》教学反思
2014/02/24 职场文书
企业节能减排实施方案
2014/03/19 职场文书
2014乡镇领导班子四风对照检查材料思想汇报
2014/10/05 职场文书
2015年乡镇财政工作总结
2015/05/19 职场文书
2015小学新教师个人工作总结
2015/10/14 职场文书
2019年干货:自我鉴定
2019/03/25 职场文书
Python中第三方库Faker的使用详解
2022/04/02 Python
基于Python实现股票收益率分析
2022/04/02 Python
Python必备技巧之函数的使用详解
2022/04/04 Python
详解Go语言中配置文件使用与日志配置
2022/06/01 Golang