好长时间没用jq, 之前用的都是ng。

想着随便参考一下,结果被坑。因为这篇文章是09年的,也和当时jq的版本号有关,但是为什么在百度排名第一,百度果然坑人,以后还是google

给出坑人文章的链接 http://www.cnblogs.com/yuzhongwusan/archive/2009/02/27/1399264.html

虽然已经解决,但是我决定重新写一篇!!!

如何判断checkbox是否选中?

文中说用 attr() 在实际判断的时候都是不可用的,判断不出来!!!

应该使用


if ($("#id").is(":checked")) {
// 存在
} else {
// 不存在
}

看到这里除了checked 还能判断什么呢?

除了判断checkout好像没有看到hover,类似于这种应该如何判断呢?

我们知道 如果$() 选择器找到一个元素必定存在一个长度,因此我们也可以根据长度去判断

if ($('#id:hover').length) {
// 元素存在
} else {
// 元素不存在
}

感觉有点跑偏了,回归正题。。。

如果修改呢,很多人用的attr,removeAttr, 这些都是错误的,尤其是remove属性后用attr无法加回来

这里应该使用pop,而不是attr

官方建议 具有 true 和 false 两个属性的属性,如 checked, selected 或者 disabled 使用prop(),其他的使用 attr()

代码如下

<form action="#">
<p><label><input type="checkbox" id="checkAll"/> Check all</label></p> <fieldset>
<legend>Loads of checkboxes</legend>
<p><label><input type="checkbox" class="case" /> Option 1</label></p>
<p><label><input type="checkbox" class="case" /> Option 2</label></p>
<p><label><input type="checkbox" class="case" /> Option 3</label></p>
<p><label><input type="checkbox" class="case" /> Option 4</label></p>
</fieldset>
</form>
$("#checkAll").change(function () {
$("input:checkbox").prop('checked', $(this).prop("checked"));
});

demo http://jsfiddle.net/mayufo/8dxx5fjk/

这时候傻呵呵以为你做完了就错了!!!你还没有考虑全选后取消一个和全部一个个选中后全选按钮

与全选按钮关联

$('.case').on('click', function () {
if ($('.case').length == $('.case:checked').length) {
$('#checkAll').prop('checked', true);
} else {
$('#checkAll').prop('checked', false);
}
})

demo http://jsfiddle.net/mayufo/8dxx5fjk/1/

参考文章

http://www.cnblogs.com/zhwl/p/3520162.html

jquery如何判断checkbox(复选框)是否被选中 全选 反选的更多相关文章

  1. 复选框(checkox)全选、全不选、反选、获得选中项值的用例

    HTML部分: <div class="all"> <ul> <li><input type="checkbox" v ...

  2. 复选框回显、全选、非全选、cookie处理数据、json数组对象转换处理学习笔记参考的页面

    <%@include file="/common/head.jsp"%> <%@ page contentType="text/html; charse ...

  3. jquery关于checkbox复选框是否被选中的问题

    本人在项目中需要用到,判断哪些复选框被用户选中.自然而然想到用 if($('').attr('checked') == true) 但是不管有没有选,$('').attr('checked')返回的都 ...

  4. 判断easyUI tree 节点复选框是否被选中的方法。将选中的节点高亮显示的方法

    在datagrid tree中如何判断某个节点的复选框是否被选中? 我们可以通过HTML结构去分析: 1.节点未选中前 2.节点选中后 所以节点被选中前和选中后,html中的class类是用区分的. ...

  5. checkbox复选框和div click事件重叠,点击div后复选框也被选中,同时改变div颜色,否则则不选中

     checkbox复选框和div click事件重叠,点击div后复选框也被选中,同时改变div颜色,否则则不选中 <!DOCTYPE html> <html lang=" ...

  6. php数组转换字符串及复选框如何勾选中

    php数组转换字符串及复选框如何勾选中,应用到函数 implode  explode 复选框被选中后如何保存数据,表单提交过来为数组,要转换字符串 用到函数implode if(!empty($_PO ...

  7. CheckedListBoxControl 实现复选框的单选与多选功能

    由于工作需要,需要实现复选框的单选与多选功能,找了好多资料都不是很全,经过两天苦苦的挖挖挖,终于完成啦O(∩_∩)O哈哈~ 用DEV控件中的CheckedListBoxControl控件,当然VS中的 ...

  8. jquery checkbox 选中 全选 插件

    checkbox  选中 全选 在项目中经常用到,但是不同的程序员写出的东西各有差异,在此整合了jquery checkbox插件,用起来很方便,也总结了我们项目中通常会出现问题的地方,一行代码搞定. ...

  9. js进阶 9-15 多选框如何限制选中数目

    js进阶 9-15 多选框如何限制选中数目 一.总结 一句话总结: 1.多选框如何限制选中数目? 没点击选择一次,来统计现在总共选了多少个,如果超出,就给onclick事件返回false,取消oncl ...

  10. 折腾一天,获取下列多选框的所有选中值,原生js可直接通过obj.val()来获取,可jq不行,要通过循环取值来获取;

    折腾一天,获取下列多选框的所有选中值,原生js可直接通过obj.val()来获取,可jq不行,要通过循环取值来获取;

随机推荐

  1. Nginx-Primary script unknown的报错的解决方法

    配置nginx时一直报错:file not found 错误日志: [error] 12691#0: *6 FastCGI sent in stderr: "Primary script u ...

  2. Arduino mega 2560驱动安装失败(没有建立对验证码(TM)签名的目录的发布者信任)的解决方法

    转载请注明出处,谢谢...... 放假的时候在自己家台式机上安装时候是很顺畅的,今天在自己本子上安装的时候就不行了~ IDE版本:1.05 问题描述:在网上搜索了相关问题,发现绝大部分安装失败的时候都 ...

  3. (十)MySQL日志

    1)日志种类 error log:错误日志 拍错 /var/log/mysqld.log \这是yum安装mysqld生成error默认目录 bin blog 二进制日志 备份 增量备份,记录DDL, ...

  4. 我从没理解js的闭包,直到他人向我这么解释。。。

    前段时间根据执行上下文写过一次闭包,但是写的简陋些.昨天在twitter上看到这篇文章,感觉背包的比喻挺恰当的.所以就翻译了. 这篇文章有些啰嗦,但是讲解很细,希望还是耐心看完.也欢迎指出错误. 原地 ...

  5. 1953 Problem B #103. 子串查找

    #include<stdio.h> #include<string.h> main() { char a[100],b[100]; int n,k,i; gets(a); ge ...

  6. Feign负载均衡(五)

    一.Feign定义 Feigin是服务消费者,Feign是一个声明式的伪Http客户端,它使得写Http客户端变得更简单.使用Feign,只需要创建一个接口并注解.它具有可插拔的注解特性,可使用Fei ...

  7. Android学习--广播机制

    广播机制简介 Android的广播可以分为两种类型的,标准广播和有序的广播: 标准广播:  是一种完全异步执行的广播,在广播发出去之后,所有的广播接收器几乎是同一时接收到这条广播. 有序广播:  是一 ...

  8. 【Ajax】PHP中ajax的基本知识点

    Ajax常用属性和方法: 属性: readyState: 0(开始创建ajax对象)1(调用open方法)2(调用send方法)3(正在返回数据)4(返回数据结束) responseText/resp ...

  9. NULL always return false

    Any comparison with null is false - = and <>, >, <, and so on. You cannot use null in an ...

  10. priority_queue的运算符重载问题

    对于需要比较的函数或STL(最常见的为sort,priority_queue) 要对自创的结构进行运算符重载(sort可以写cmp,一样的效果) 1.只能对小于号重载 cmp函数与其起到相同的作用 2 ...