jquery如何判断checkbox(复选框)是否被选中 全选 反选
好长时间没用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/
参考文章
jquery如何判断checkbox(复选框)是否被选中 全选 反选的更多相关文章
- 复选框(checkox)全选、全不选、反选、获得选中项值的用例
HTML部分: <div class="all"> <ul> <li><input type="checkbox" v ...
- 复选框回显、全选、非全选、cookie处理数据、json数组对象转换处理学习笔记参考的页面
<%@include file="/common/head.jsp"%> <%@ page contentType="text/html; charse ...
- jquery关于checkbox复选框是否被选中的问题
本人在项目中需要用到,判断哪些复选框被用户选中.自然而然想到用 if($('').attr('checked') == true) 但是不管有没有选,$('').attr('checked')返回的都 ...
- 判断easyUI tree 节点复选框是否被选中的方法。将选中的节点高亮显示的方法
在datagrid tree中如何判断某个节点的复选框是否被选中? 我们可以通过HTML结构去分析: 1.节点未选中前 2.节点选中后 所以节点被选中前和选中后,html中的class类是用区分的. ...
- checkbox复选框和div click事件重叠,点击div后复选框也被选中,同时改变div颜色,否则则不选中
checkbox复选框和div click事件重叠,点击div后复选框也被选中,同时改变div颜色,否则则不选中 <!DOCTYPE html> <html lang=" ...
- php数组转换字符串及复选框如何勾选中
php数组转换字符串及复选框如何勾选中,应用到函数 implode explode 复选框被选中后如何保存数据,表单提交过来为数组,要转换字符串 用到函数implode if(!empty($_PO ...
- CheckedListBoxControl 实现复选框的单选与多选功能
由于工作需要,需要实现复选框的单选与多选功能,找了好多资料都不是很全,经过两天苦苦的挖挖挖,终于完成啦O(∩_∩)O哈哈~ 用DEV控件中的CheckedListBoxControl控件,当然VS中的 ...
- jquery checkbox 选中 全选 插件
checkbox 选中 全选 在项目中经常用到,但是不同的程序员写出的东西各有差异,在此整合了jquery checkbox插件,用起来很方便,也总结了我们项目中通常会出现问题的地方,一行代码搞定. ...
- js进阶 9-15 多选框如何限制选中数目
js进阶 9-15 多选框如何限制选中数目 一.总结 一句话总结: 1.多选框如何限制选中数目? 没点击选择一次,来统计现在总共选了多少个,如果超出,就给onclick事件返回false,取消oncl ...
- 折腾一天,获取下列多选框的所有选中值,原生js可直接通过obj.val()来获取,可jq不行,要通过循环取值来获取;
折腾一天,获取下列多选框的所有选中值,原生js可直接通过obj.val()来获取,可jq不行,要通过循环取值来获取;
随机推荐
- django配置使用redis
通常redis都是用来保存session.短信验证码.图片验证码等数据. 在django上使用redis,先要安装一个包: pip install django-redis==4.8.0(我用的dja ...
- SPOJ - AMR11H
Array Diversity Time Limit: 404MS Memory Limit: 1572864KB 64bit IO Format: %lld & %llu Submi ...
- AC日记——Crane poj 2991
POJ - 2991 思路: 向量旋转: 代码: #include <cmath> #include <cstdio> #include <cstring> #in ...
- basic paxos解析
basic paxos是我见过最难懂的算法,我最近一个月都在研究这个东西,自认有一些粗浅的心得,在这里写一下我对它的理解 为了降低理解难度,本文使用了大量的比喻,可能词不达意,见谅 basic pax ...
- HDU 1020.Encoding-字符压缩
Encoding Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others)Total Su ...
- HDU 2035.人见人爱A^B-快速幂
人见人爱A^B Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others)Total Sub ...
- python3爬虫爬取煎蛋网妹纸图片(下篇)2018.6.25有效
分析完了真实图片链接地址,下面要做的就是写代码去实现了.想直接看源代码的可以点击这里 大致思路是:获取一个页面的的html---->使用正则表达式提取出图片hash值并进行base64解码--- ...
- Jenkins使用SSH远程发布
远程发布需要安装Publish Over SSH插件 比如我们的应用服务器都是通过tomcat用户启动程序,因此,在jenkin服务器上配置免密登录远程服务器tomcat用户 //生成密钥对 ssh- ...
- 6.4(java学习笔记)转换流
一.乱码问题 我们来看下列例子: public class ConStream { //当前平台默认采用GBK public static void main(String[] args){ Stri ...
- 使用shell生成随机数
#!/bin/bash $` do $` do s=$(($RANDOM%)) done done 第1行:#!/bin/bash是指此脚本使用/bin/bash来解释执行.其中,#!是一个特殊的表示 ...