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

<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. Android studio NDK 编译 "$USE_DEPRECATED_NDK=true" 异常问题解决

    我的项目是https://github.com/leixiaohua1020/simplest_ffmpeg_mobile/tree/master/simplest_ffmpeg_android_st ...

  2. CodeWarrior环境下中断使用

    对于飞思卡尔CodeWarrior的中断使用,一般有3种方法: 1.把#pragma TRAP_PROC放在中断程序前面,并把中断向量表放到*.prm. 例如: #pragma TRAP_PROC v ...

  3. JS/React 判断对象是否为空对象

    JS一般判断对象是否为空,我们可以采用: if(!x)的方式直接判断,但是如果是一个空对象,比如空的JSON对象,是这样的:{},简单的判断是不成功的,因为它已经占用着内存了,如果是JQuery的话, ...

  4. 使用IntelliJ IDEA 14和Maven创建java web项目

    参考地址 http://www.cnblogs.com/jifeng/p/4658765.html

  5. Binary Tree Postorder Traversal--leetcode难题讲解系列

    https://leetcode.com/problems/binary-tree-postorder-traversal/ Given a binary tree, return the posto ...

  6. UNITY3D在IOS开发下的反射机制限制

    IOS上的反射是部分支持,支持使用反射读取源代码,但不支持使用反射动态生成可执行代码,下面是限制反射的命名空间:ProfilerReflection.EmitReflection.Emit.Save ...

  7. EventBus使用介绍

    EventBus是Android下高效的发布/订阅事件总线机制.作用是可以代替传统的Intent,Handler,Broadcast或接口函数在Fragment,Activity,Service,线程 ...

  8. C#的设计模式分为3大类23种

    创建型: 1. 单件模式(Singleton Pattern) 2. 抽象工厂(Abstract Factory) 3. 建造者模式(Builder) 4. 工厂方法模式(Factory Method ...

  9. 转:php park、unpark、ord 函数使用方法(二进制流接口应用实例)

    在工作中,我也逐渐了解到park,unpark,ord对于二进制字节处理的强大. 下面我逐一介绍它们.     park,unpark,ord这3个函数,在我们工作中,用到它们的估计不多. 我在最近一 ...

  10. HDU 3487 Play with Chain(Splay)

    题目大意 给一个数列,初始时为 1, 2, 3, ..., n,现在有两种共 m 个操作 操作1. CUT a b c 表示把数列中第 a 个到第 b 个从原数列中删除得到一个新数列,并将它添加到新数 ...