jquery实现全选功能效果的实现代码


Posted in Javascript onMay 05, 2016

主要是模拟一些网页中的表格实现全选功能。

<form>     

你爱好的运动是:    

<input type="checkbox" id="Check" value="全选/全不选"/>全选/全不选     <br />     

<input type="checkbox" name="items" value="足球" />足球     

<input type="checkbox" name="items" value="篮球" />篮球    

<input type="checkbox" name="items" value="羽毛球" />羽毛球     

<input type="checkbox" name="items" value="乒乓球" />乒乓球 

</form>

当我们点击全选/全部不选按钮时,下面的checkbox执行相应的操作。

同时反过来,当全选时,下面任意一个checkbox未选中,则全选/全不选按钮也不会被选中。

$('[name=items]:checkbox').click(function () {                 

var p = $('[name=items]:checkbox');        

 if(p.filter(':checked').length==p.length)        

{           //alert("Hello World");          

 $("#Check").attr("checked", true);        

} else {          

$("#Check").attr("checked", false);       

 }      

});

以上这篇jquery实现全选功能效果的实现代码就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
修改好的jquery滚动字幕效果实现代码
Jun 22 Javascript
js控制table合并具体实现
Feb 20 Javascript
Thinkphp模板没有解析直接原样输出的解决方法
Oct 31 Javascript
AngularJS国际化详解及示例代码
Aug 18 Javascript
AngularJS 自定义过滤器详解及实例代码
Sep 14 Javascript
JS+HTML5实现的前端购物车功能插件实例【附demo源码下载】
Oct 17 Javascript
Vuex和前端缓存的整合策略详解
May 09 Javascript
详解angular路由高亮之RouterLinkActive
Apr 28 Javascript
Vue引入jquery实现平滑滚动到指定位置
May 09 jQuery
vue2 v-model/v-text 中使用过滤器的方法示例
May 09 Javascript
JS实现处理时间,年月日,星期的公共方法示例
May 31 Javascript
webpack4 配置 ssr 环境遇到“document is not defined”
Oct 24 Javascript
ichart.js绘制虚线、平均分虚线效果的实现代码
May 05 #Javascript
animate 实现滑动切换效果【实例代码】
May 05 #Javascript
JavaScript中各种引用类型的常用操作方法小结
May 05 #Javascript
Sea.JS知识总结
May 05 #Javascript
在Node.js中使用Javascript Generators详解
May 05 #Javascript
JavaScript编写检测用户所使用的浏览器的代码示例
May 05 #Javascript
JS中dom0级事件和dom2级事件的区别介绍
May 05 #Javascript
You might like
php 按指定元素值去除数组元素的实现方法
2011/11/04 PHP
浅析PHP中的UNICODE 编码与解码
2013/06/29 PHP
PHP实现ftp上传文件示例
2014/08/21 PHP
调试WordPress中定时任务的相关PHP脚本示例
2015/12/10 PHP
php支付宝在线支付接口开发教程
2016/09/19 PHP
PHP7新特性
2021/03/09 PHP
IE iframe的onload方法分析小结
2010/01/07 Javascript
IE6、IE7中setAttribute不支持class/for/rowspan/colspan等属性
2011/08/28 Javascript
关于onchange事件在IE和FF下的表现及解决方法
2014/03/08 Javascript
JavaScript实现数组随机排序的方法
2015/06/26 Javascript
基于jquery实现省市联动效果
2015/11/23 Javascript
Windows环境下npm install 报错: operation not permitted, rename的解决方法
2016/09/26 Javascript
Avalonjs双向数据绑定与监听的实例代码
2017/06/23 Javascript
vue的基本用法与常见指令
2017/08/15 Javascript
微信小程序之页面跳转和参数传递的实现
2017/09/29 Javascript
JS表单传值和URL编码转换
2018/03/03 Javascript
深入理解Vue.js轻量高效的前端组件化方案
2018/12/10 Javascript
JavaScript实现数字前补“0”的五种方法示例
2019/01/03 Javascript
bootstrap table列和表头对不齐的解决方法
2019/07/19 Javascript
Vue-router 报错NavigationDuplicated的解决方法
2020/03/31 Javascript
[40:03]DOTA2上海特级锦标赛主赛事日 - 1 败者组第一轮#1EHOME VS Archon
2016/03/02 DOTA
[53:52]EG vs VGJ.T 2018国际邀请赛小组赛BO2 第一场 8.16
2018/08/17 DOTA
使用Python的Tornado框架实现一个一对一聊天的程序
2015/04/25 Python
Python tkinter实现的图片移动碰撞动画效果【附源码下载】
2018/01/04 Python
浅谈使用Python内置函数getattr实现分发模式
2018/01/22 Python
pandas 取出表中一列数据所有的值并转换为array类型的方法
2018/04/11 Python
numpy 计算两个数组重复程度的方法
2018/11/07 Python
Python爬虫实现验证码登录代码实例
2019/05/10 Python
Ubuntu18.04中Python2.7与Python3.6环境切换
2019/06/14 Python
tensorflow模型的save与restore,及checkpoint中读取变量方式
2020/05/26 Python
梵蒂冈和罗马卡:Omnia Card Pass
2018/02/10 全球购物
Java如何调用外部Exe程序
2015/07/04 面试题
正科级干部考察材料
2014/05/29 职场文书
计算机求职信
2014/07/02 职场文书
会议邀请函
2015/01/30 职场文书
红领巾广播站广播稿
2015/08/19 职场文书