好长时间没用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. 在oracle官网上,找到我们所需版本的jdk

    oracle的官网,因为都是英文,而且内容还特别多,经常的找不到历史版本的JDK. 特地,将找历史版本JDK的方法记录下来. 访问:http://www.oracle.com/technetwork/ ...

  2. [ Openstack ] Openstack-Mitaka 高可用之 环境初始化

    目录 Openstack-Mitaka 高可用之 概述    Openstack-Mitaka 高可用之 环境初始化    Openstack-Mitaka 高可用之 Mariadb-Galera集群 ...

  3. .NET DataSet DataTable 导出excel

    public void CreateExcel(DataSet ds, string FileName) { HttpResponse resp; resp = Page.Response; resp ...

  4. 动态加载ajax 腾讯视频评论

    import urllib import urllib2 import os import requests import re import json sns_url = 'http://sns.v ...

  5. java Class.forName()

    Java程序在运行时,Java运行时系统一直对所有的对象进行所谓的运行时类型标识.这项信息纪录了每个对象所属的类. 虚拟机通常使用运行时类型信息选准正确方法去执行,用来保存这些类型信息的类是Class ...

  6. tushrea知识笔记

    生成时间序列: dates = pandas.date_range('2013-01-01',periods = 6) Pandas读取excel数据: df=pd.read_excel(" ...

  7. Problem C: #104. 普通平衡树

    #include<iostream> #include<cstdio> #include<cstring> #include<cstdlib> #inc ...

  8. Centos6.5安装mysql5.7详解

    最近在linux上面安装mysql5.7上真是遇到了很多坑,真是让人头疼,在这里跟大家简单分享一下流程跟注意的地方. 1.查看linux版本是6.5 cat /etc/redhat-release 2 ...

  9. 数据排序 第一讲( 各种排序方法 结合noi题库1.10)

    选择排序 1.基本思想:每一趟从待排序的数据元素选出最小或最大的一个元素,数按序排放在待排序的元素的最前端,直到全部待排序的元素排完 2.基本代码 px(int r[]) { ;i<n;i++) ...

  10. NVL NVL2 COALESCE NULLIF decode

    NVL(EXPR1,EXPR2)NVL2(EXPR1,EXPR2,EXPR3)NULLIF(EXPR1,EXPR2)COALESCE(EXPR1,,..,EXPRn)decode --------NV ...