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

<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实现全选功能的更多相关文章

  1. 问题1:jquery实现全选功能,第二次失效(已解决)

    问题:使用了attr("checked",true”)设置子复选框的被选状态,第一次执行功能正常,但第二次失效. 解决方案:将attr("checked",tr ...

  2. jquery与js实现全选功能的区别---2017-05-12

    一.jquery常用的事件 click(),dbclick() focus(),blur() change() keydown(),keypress(),keyup() mousedown(),mou ...

  3. jQuery实现全选与全不选功能

    初始时: 实现功能后: 实现该功能的核心代码: <script> $(function(){ $("#selectBtn").click(function(){ con ...

  4. JQUERY的给Check全选功能

    //给Checkbox提供全选功能 $("#checkall").click(function(){ if(this.checked){ $("input[name='c ...

  5. jQuery实现全选效果【转】

    这是一段用jquery实现全选的代码,主要思路如下: 1.所有的复选框都有单击事件,所有效果都是在单击事件下实现的 2.全选复选框所实现的功能与其他复选选项实现的功能不同,所有在单击事件内做一个判断, ...

  6. jQuery实现全选、全不选、反选

    如图,需要使用jQuery实现全选.全不选.反选功能: 核心代码: 全选 $("#check_all").click(function(){ $("input:check ...

  7. 利用JQuery实现全选和反选的几种方法

    前面介绍了利用JavaScript实现全选功能,其中也有要注意的几点,现在讲解下在JQuery怎么实现全选和反选,下面提供了两种方法实现. 如图:要实现的效果是点击全选框全部选中,再点击全部不选中 方 ...

  8. js初学—实现checkbox全选功能

    布局如下: <p ><input type="checkbox" id="che1"/>全选</p><div id=& ...

  9. python: jquery实现全选 反选 取消

    引入这个jquery-1.12.4.js jquery实现全选 反选 取消 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitio ...

随机推荐

  1. WCF 数据服务 4.5

    .NET Framework 4.5 其他版本 WCF 数据服务(以前称为"ADO.NET Data Services")是 .NET Framework 的一个组件.可以使用此组 ...

  2. python环境中运行程序

    运行Python程序,我们比较常用的是直接在Windows命令提示窗口或者Linux终端或shell窗口中,直接:Python *.py,或者在Linux环境下,在投不中,加入: #!/usr/bin ...

  3. 怎么删除github上的仓库

    1.到你的个人中心.点击你的个人账号.下图的红色部分 2.点击repositories(仓库),选择你要删除的项目 3.code这一行导航栏 最后的一个. setting 4.下拉页面到最下面 Del ...

  4. 移动应用安全开发指南(Android)--完结篇(http://www.bubuko.com/infodetail-577312.html)

    1.认证和授权 概述 认证是用来证明用户身份合法性的过程,授权是用来证明用户可以合法地做哪些事的过程,这两个过程一般是在服务器端执行的,但也有的APP出于性能提升或用户体验等原因,将其做在客户端完成, ...

  5. Mac OS 下安装rar unrar命令

    环境 操作系统:Mac OS X 10.9.4 1. 下载 地址: http://www.rarlab.com/rar/rarosx-5.2.0.tar.gz 2. 安装 解压后进入目录 MacBoo ...

  6. 分享一个web应用程序池管理工具

    因为项目在联调阶段由于各种各样的原因需要重启应用程序池,而调试服务器基本都需要远登操作.同样的情况也会发生在线上,如果公司权限控制得比较严格,每次都要多部门的服务器权限申请的话有点麻烦, 所以抽点时间 ...

  7. Source Insight 使用

    1.括号配对高亮:“在前括号左侧,后括号左侧” 双击鼠标左键,可以选定匹配括号和其中内容(<>,(),L{R},[]之间) 2.让{ 和 } 不缩进:Options -> Docum ...

  8. Spark 实时计算整合案例

    1.概述 最近有同学问道,除了使用 Storm 充当实时计算的模型外,还有木有其他的方式来实现实时计算的业务.了解到,在使用 Storm 时,需要编写基于编程语言的代码.比如,要实现一个流水指标的统计 ...

  9. Haproxy配置支持https获取用户IP地址

    global log 127.0.0.1 local0 chroot /var/lib/haproxy #chroot运行路径 pidfile /var/run/haproxy.pid #haprox ...

  10. css3实现进度条的模拟

    两种进度条动画的实现: 1.css3,但IE9-不支持. 2.js动画,兼容性好,但没有css3实现的顺畅 Demo: <html>    <head>        < ...