jQuery实现复选框成对选择及对应取消的方法


Posted in Javascript onMarch 03, 2015

本文实例讲述了jQuery实现复选框成对选择及对应取消的方法。分享给大家供大家参考。具体实现方法如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>jQuery实现复选框成对选择,对应取消功能</title>

<script type="text/javascript" src="/js/jquery-1.6.2.min.js"></script>

<script>

$(function(){

 var classA = $(".classA");

 classA.change(function(){

  classA.attr("checked",Boolean($(this).attr("checked")));

 })

 var classB = $(".classB");

 classB.change(function(){

  classB.attr("checked",Boolean($(this).attr("checked")));

 })

})

</script>

</head>

<body>

<p>A组</p>

<input type="checkbox" class="classA">

<input type="checkbox" class="classA">

<p>B组</p>

<input type="checkbox" class="classB">

<input type="checkbox" class="classB">

</body>

</html>

希望本文所述对大家的jQuery程序设计有所帮助。

Javascript 相关文章推荐
用javascript连接access数据库的方法
Nov 17 Javascript
js异或加解密效果代码
Jun 25 Javascript
javascript 面向对象全新理练之继承与多态
Dec 03 Javascript
Jquery ui css framework
Jun 28 Javascript
基于jquery实现后台左侧菜单点击上下滑动显示
Apr 11 Javascript
jQuery关键词说明插件cluetip使用指南
Apr 21 Javascript
从重置input file标签中看jQuery的 .val() 和 .attr(“value”) 区别
Jun 12 Javascript
js实现上下左右弹框划出效果
Mar 08 Javascript
Vue监听数据对象变化源码
Mar 09 Javascript
angular 组件通信的几种实现方式
Jul 13 Javascript
vue.js实现会动的简历(包含底部导航功能,编辑功能)
Apr 08 Javascript
微信小程序使用字体图标的方法
May 23 Javascript
js实现文本框中输入文字页面中div层同步获取文本框内容的方法
Mar 03 #Javascript
JS实现文字放大效果的方法
Mar 03 #Javascript
jQuery实现的感应鼠标悬停图片色彩渐显效果
Mar 03 #Javascript
js给网页加上背景音乐及选择音效的方法
Mar 03 #Javascript
分享一则JavaScript滚动条插件源码
Mar 03 #Javascript
深入理解JavaScript系列(35):设计模式之迭代器模式详解
Mar 03 #Javascript
jQuery选择器之基本选择器与层次选择器
Mar 03 #Javascript
You might like
php+mysql实现无限级分类 | 树型显示分类关系
2006/11/19 PHP
php header()函数使用说明
2008/07/10 PHP
Nigma vs Liquid BO3 第一场2.13
2021/03/10 DOTA
js中的escape及unescape函数的php实现代码
2007/09/04 Javascript
javascript 写类方式之六
2009/07/05 Javascript
使用js声明数组,对象在jsp页面中(获得ajax得到json数据)
2013/11/05 Javascript
setInterval与clearInterval的使用示例代码
2014/01/28 Javascript
javascript实现在下拉列表中显示多级树形菜单的方法
2015/08/12 Javascript
JavaScript子窗口调用父窗口变量和函数的方法
2015/10/09 Javascript
AngularJS基础 ng-keypress 指令简单示例
2016/08/02 Javascript
基于JS实现网页中的选项卡(两种方法)
2017/06/16 Javascript
Vue学习笔记进阶篇之vue-cli安装及介绍
2017/07/18 Javascript
基于JavaScript实现新增内容滚动播放效果附完整代码
2017/08/24 Javascript
JavaScript如何获取到导航条中HTTP信息
2017/10/10 Javascript
Vue实战之vue登录验证的实现代码
2017/10/31 Javascript
React 使用browserHistory项目访问404问题解决
2018/06/01 Javascript
详解js创建对象的几种方法及继承
2019/04/12 Javascript
vue使用element-ui实现表单验证
2020/12/13 Vue.js
Python内置函数之filter map reduce介绍
2014/11/30 Python
Python通过poll实现异步IO的方法
2015/06/04 Python
利用ctypes提高Python的执行速度
2016/09/09 Python
Python Sqlite3以字典形式返回查询结果的实现方法
2016/10/03 Python
在Python中通过getattr获取对象引用的方法
2019/01/21 Python
简单了解Pandas缺失值处理方法
2019/11/16 Python
详解用Python爬虫获取百度企业信用中企业基本信息
2020/07/02 Python
python打开音乐文件的实例方法
2020/07/21 Python
详解CSS3选择器:nth-child和:nth-of-type之间的差异
2017/09/18 HTML / CSS
英国舒适型鞋履品牌:FitFlop
2017/05/17 全球购物
Lowe’s加拿大:家居装修、翻新和五金店
2019/12/06 全球购物
亚马逊加拿大网站:Amazon.ca
2020/01/06 全球购物
什么是设计模式
2012/06/17 面试题
大学生的自我鉴定范文
2014/01/21 职场文书
《兰亭集序》教学反思
2014/02/11 职场文书
青年安全生产示范岗事迹材料
2014/05/04 职场文书
森马旗舰店双十一营销方案
2014/09/29 职场文书
六五普法先进个人主要事迹材料
2015/11/03 职场文书