jquery checkbox 复选框多次点击判断选中状态,以及全选/取消的代码示例

简介: 2015年12月21日 10:52:51 星期一 目标, 点击当前的checbox, 判断点击后当前checkbox是否是选中状态. html: 全选 js:  1 var checkall = $("#contracts_checkall").

2015年12月21日 10:52:51 星期一

目标, 点击当前的checbox, 判断点击后当前checkbox是否是选中状态.

html:

<input type="checkbox" onclick="contracts_checkall()" id="contracts_checkall"> 全选

js: 

1         var checkall = $("#contracts_checkall").attr('checked');
2         var checkall_value1 = $("#contracts_checkall").val();
3         var checkall_value2 = $('#contracts_checkall').is(':checked');
4         console.log(checkall);
5         console.log(checkall_value1);
6         console.log(checkall_value2);

第一次点击:

1  undefined
2  undefined
3  on
4  true

第二次点击:

1  undefined
2  undefined
3  on
4  false

总结, 用is()方法可以判断当前复选框的状态, 即使没有相关属性

全选/取消全选

 1 function contracts_checkall()
 2 {
 3     var checkall = $('#contracts_checkall').is(':checked');
 6     $("input[name='contract[]']").each(
 7         function () {
 8             this.checked=checkall;
 9             // $(this).attr('checked', checkall); //第一次选中和取消是成功的, 再次选中就不起作用了
10         }
11     );
12 }

 

Finger PHP 框架

目录
相关文章
|
4月前
|
JavaScript
基于jQuery实现文字点击验证代码
jQuery文字点击验证代码基于jquery-3.4.1.min.js制作,按顺序,依次点击文字通过验证。
44 5
|
4月前
|
JavaScript
jQuery实现的星级打分带评价及颜色区分代码
jQuery实现的星级打分带评价及颜色区分效果代码是一款支持自定义评论颜色的星级评价打分,其中红色为一星级,差评、绿色位五星级、满分好评,本段代码适应于所有网页使用,有需要的朋友们就来下载使用吧。
51 2
|
7月前
|
JavaScript
鼠标事件(点击换色)分别使用js和jQuery代码实现
鼠标事件(点击换色)分别使用js和jQuery代码实现
58 1
|
7月前
|
JavaScript Java
点击按钮,向下添加目录。Java script+jQuery写法
点击按钮,向下添加目录。Java script+jQuery写法
46 1
|
7月前
|
JavaScript Java
分别使用js与jquery写 单击按钮时出现内容 点击删除按钮不会再向下出现
分别使用js与jquery写 单击按钮时出现内容 点击删除按钮不会再向下出现
37 1
|
9月前
|
JavaScript 前端开发
杨校老师课堂之Web前端JS类库_JQuery案例[效果图与代码齐全]
杨校老师课堂之Web前端JS类库_JQuery案例[效果图与代码齐全]
47 0
|
9月前
|
JavaScript
jQuery如何验证复选框是否选中
jQuery如何验证复选框是否选中
41 0
|
10月前
|
JavaScript 前端开发 索引
jQuery学习教程,写更少的代码,做更多的事情(二)
jQuery学习教程,写更少的代码,做更多的事情(二)
|
10月前
|
JavaScript 前端开发
【Web 前端】如何在点击一个按钮时使用 jQuery 隐藏一个图片?
【5月更文挑战第2天】【Web 前端】如何在点击一个按钮时使用 jQuery 隐藏一个图片?
|
10月前
|
JSON JavaScript 数据格式
jQuery 树型菜单完整代码
jQuery 树型菜单完整代码