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

<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. Activity intent经常使用的 FLAG

    Intent.FLAG_ACTIVITY_NEW_TASK 默认的跳转类型,会重新创建一个新的Activity,不过与这种情况,比方说Task1中有A,B,C三个Activity,此时在C中启动D的话 ...

  2. java生成解析xml的另外两种方法JAXB

     JAXB(Java Architecture for XML Binding) 是一个业界的标准,是一项可以根据XML Schema产生Java类的技术.该过程中,JAXB也提供了将XML实例文档反 ...

  3. Spring整合JAX-WS

    Jax-ws在使用上很方便,也很轻量级.重点是他是jvnet(dev.java.net)的项目,是基于java标准的(JSR181). 不过它与Spring的整合相对麻烦,于此,我将自己的一些研究结果 ...

  4. 代码生成的地址:mygeneration

    一个代码生成的地址: https://gitshell.com/shiningrise/mygeneration/

  5. 头文件 string.h cstring string 区别

    1.#include <cstring>   //不可以定义string s:可以用到strcpy等函数using   namespace   std; #include <stri ...

  6. Java8简明教程(转载)

    ImportNew注:有兴趣第一时间学习Java 8的Java开发者,欢迎围观<征集参与Java 8原创系列文章作者>. 以下是<Java 8简明教程>的正文. “Java并没 ...

  7. Linq专题之var关键字

    在c#1.0,c#2.0中声明一个变量时,总是要指定变量的类型,如果不指定变量类型编译器就会报错,产生编译错误.在c#3.0中我们可以不指定变量的具体类型,而使用一个新的关键字"var&qu ...

  8. CENTOS 基础指令——查看系统环境

    1.查看内核版本 # cat /proc/version # uname -a # uname -r 2.查看linux版本 # cat /etc/issue # cat /etc/redhat-re ...

  9. Ubuntu 配置AP总结

    1.这个是使用别人写的一个GUI来配置,:http://hi.baidu.com/lexiangtaotao/item/5d4e87f22db132c70cd1c86f 2.使用hostapd配置:h ...

  10. 安卓开发笔记——自定义广告轮播Banner(实现无限循环)

    关于广告轮播,大家肯定不会陌生,它在现手机市场各大APP出现的频率极高,它的优点在于"不占屏",可以仅用小小的固定空位来展示几个甚至几十个广告条,而且动态效果很好,具有很好的用户& ...