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 相关文章推荐
Html中JS脚本执行顺序简单举例说明
Jun 19 Javascript
jquery 学习之二 属性(html()与html(val))
Nov 25 Javascript
js实现数组去重、判断数组以及对象中的内容是否相同
Nov 29 Javascript
Javascript仿PHP $_GET获取URL中的参数
May 12 Javascript
删除javascript中注释语句的正则表达式
Jun 11 Javascript
浅谈Jquery为元素绑定事件
Apr 27 Javascript
JavaScript的设计模式经典之建造者模式
Feb 24 Javascript
node.JS md5加密中文与php结果不一致的解决方法
May 05 Javascript
JQuery用$.ajax或$.getJSON跨域获取JSON数据的实现代码
Sep 23 jQuery
基于jQuery解决ios10以上版本缩放问题
Nov 03 jQuery
layui-table对返回的数据进行转变显示的实例
Sep 04 Javascript
es6函数之箭头函数用法实例详解
Apr 25 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数组是否为空的代码
2011/09/08 PHP
PHP检测移动设备类mobile detection使用实例
2014/04/14 PHP
PHP生成短网址的3种方法代码实例
2014/07/08 PHP
php对象和数组相互转换的方法
2015/05/12 PHP
ThinkPHP整合datatables实现服务端分页的示例代码
2018/02/10 PHP
Javascript里使用Dom操作Xml
2007/01/22 Javascript
setTimeout()与setInterval()方法区别介绍
2013/12/24 Javascript
模拟用户点击弹出新页面不会被浏览器拦截
2014/04/08 Javascript
jQuery多级弹出菜单插件ZoneMenu
2014/12/18 Javascript
JavaScript学习笔记之JS事件对象
2015/01/22 Javascript
Eclipse配置Javascript开发环境图文教程
2015/01/29 Javascript
js结合正则实现国内手机号段校验
2015/06/19 Javascript
Bootstrap导航条可点击和鼠标悬停显示下拉菜单
2016/11/25 Javascript
Bootstrap popover用法详解
2016/12/22 Javascript
js点击任意区域弹出层消失实现代码
2016/12/27 Javascript
JQuery实现动态操作表格
2017/01/11 Javascript
js图片轮播插件的封装
2017/07/21 Javascript
Angular.js通过自定义指令directive实现滑块滑动效果
2017/10/13 Javascript
vue项目中,main.js,App.vue,index.html的调用方法
2018/09/20 Javascript
详解Vue 项目中的几个实用组件(ts)
2019/10/29 Javascript
js与jquery获取input输入框中的值实例讲解
2020/02/27 jQuery
vue+elementui通用弹窗的实现(新增+编辑)
2021/01/07 Vue.js
用Python编写分析Python程序性能的工具的教程
2015/04/01 Python
requests和lxml实现爬虫的方法
2017/06/11 Python
python爬虫爬取快手视频多线程下载功能
2018/02/28 Python
深入分析python中整型不会溢出问题
2018/06/18 Python
python中字符串内置函数的用法总结
2018/09/13 Python
Python实现多态、协议和鸭子类型的代码详解
2019/05/05 Python
python向企业微信发送文字和图片消息的示例
2020/09/28 Python
美国嘻哈文化生活方式品牌:GLD
2018/04/15 全球购物
酒店个人培训自我鉴定
2013/12/11 职场文书
公司合作协议书范本
2014/04/18 职场文书
幼儿园迎国庆65周年活动策划方案
2014/09/16 职场文书
高一军训感想
2015/08/07 职场文书
辞职信怎么写?你都知道吗?
2019/06/24 职场文书
springboot使用Redis作缓存使用入门教程
2021/07/25 Redis