好长时间没用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. golang命令行参数解析

    package main import ( "fmt" "os" ) func main(){ s:= os.Args fmt.Println(s) } 直接执 ...

  2. python unittest 快速入门

    import unittest def add(x, y): return x + y class TestLearning(unittest.TestCase): def setUp(self): ...

  3. Ansi,UTF8,Unicode,ASCII编码的区别 ---我看完了 明白了很多

    来自:http://blog.csdn.net/xiongxiao/article/details/3741731 ------------------------------------------ ...

  4. selenium3+python自动化50-环境搭建(firefox)【转载】

    前言 有不少小伙伴在安装selenium环境后启动firefox报错,因为现在selenium升级到3.0了,跟2.0的版本还有有一点区别的. 安装环境过程中主要会遇到三个坑: 1.'geckodri ...

  5. eclipse断点调试基础

    进入debug模式: 1.设置断点 2.启动servers端的debug模式 3.运行程序,在后台遇到断点时,进入debug调试状态 ============================= 作用域 ...

  6. React入门 (2)—实现微博展示列表

    前言 如果从来不了解React先看前篇React入门 (1)-使用指南(包括ES5和ES6对比). 本文为了能将前篇学到的react知识学以致用,做了一个类似微博展示列表的demo.使用的是ES6+R ...

  7. Java中导入导出Excel -- POI技术

    一.介绍: 当前B/S模式已成为应用开发的主流,而在企业办公系统中,常常有客户这样子要求:你要把我们的报表直接用Excel打开(电信系统.银行系统).或者是:我们已经习惯用Excel打印.这样在我们实 ...

  8. Nmap——主机、端口扫描工具

    nmap 其基本功能有三个,一是探测一组主机是否在线:其次是扫描主机端口,嗅探所提供的网络服务:还可以推断主机所用的操作系统 . 这是百度给的介绍:http://baike.baidu.com/lin ...

  9. asp.net中利用JSON进行增删改查中运用到的方法

    //asp.net中 利用JSON进行操作, //增加: //当点击“增加链接的时候”,弹出增加信息窗口,然后,在窗体中输入完整信息,点击提交按钮. //这里我们需要考虑这些:我会进行异步提交,使用j ...

  10. luogu P1359会议

    //以一号节点为根节点,求出所有节点到根结点的距离,以及所有点的子节点的个数 //然后计算根据已知信息计算所有节点到当前结点的距离 //然后扫描n个点,O(n)求解 #include<bits/ ...