jQuery checkbox 全选
jQuery 1.6版本以后 if($("#id").attr("checked")) 不能返回 ture 和 false
高版本中jQuery 提供prop
它将“属性”与“特性”做了区别,属性指的是“name,id”等等,特性指的是“selectedIndex, tagName, nodeName”等等。
JQ1.6之后,可以通过attr方法去获得属性,通过prop方法去获得特性
//获取是否选中
var isChecked = $('#id').prop('checked');
//或
var isChecked = $('#id').is(":checked");
//设置选中
$('#id').prop('checked' true)
<input id="btnCheckAll" type="checkbox" />全
<input id="Checkbox2" name="chkItem" type="checkbox" />1
<input id="Checkbox3" name="chkItem" type="checkbox" />2
<input id="Checkbox4" name="chkItem" type="checkbox" />3
<div>
<input id="btnCheckAll" type="button" value="全选" />
<input id="btnCheckNone" type="button" value="全不选" />
<input id="btnCheckReverse" type="button" value="反选" />
<input id="btnSubmit" type="button" value="提交" />
</div>
<script type="text/javascript">
$(function ()
{
$("#ccbCheckAll").click(function ()
{
//多种实现方式
//方式1
//if ($("#ccbCheckAll").prop('checked'))
// {
// $("input[name = 'chkItem']").prop("checked", true);
// }
// else
// {
// $("[name = chkItem]:checkbox").attr("checked", false);
// }
//方式2 $("#ccbCheckAll").prop("tagName"); //INPUT
//$("input[name='chkItem']").prop("checked", $(this).prop('checked'));
//方式3
//$("[name = chkItem]:checkbox").prop("checked", $(this).prop('checked'));
//方式4
$("[name = chkItem]").prop("checked", $(this).prop('checked'));
}); $("input[name = 'chkItem']").click(function ()
{
$("[name = chkItem]").prop("checked", $(this).prop('checked'));
});
//按钮形式
//全选
$("#btnCheckAll").bind("click", function ()
{
$("[name = chkItem]:checkbox").prop("checked", true);
});
// 全不选
$("#btnCheckNone").bind("click", function ()
{
$("[name = chkItem]:checkbox").prop("checked", false);
});
// 反选
$("#btnCheckReverse").bind("click", function ()
{
$("[name = chkItem]:checkbox").each(function ()
{
$(this).prop("checked", !$(this).prop("checked"));
});
});
$("#btnSubmit").bind("click", function ()
{
var result = new Array();
$("[name = chkItem]:checkbox").each(function ()
{
if ($(this).is(":checked"))
{
result.push($(this).prop("value"));
}
});
alert(result.join(","));
});
})
</script>
jQuery checkbox 全选的更多相关文章
- jquery checkbox全选,全不选,反选方法,jquery checkbox全选只能操作一次
jquery checkbox全选,全不选,反选方法, jquery checkbox全选只能操作一次, jquery checkbox全选只有第一次成功 >>>>>&g ...
- jQuery checkBox 全选的例子
表单处理时经常会有全选的功能,但是这个功能往往会被忽视一个细节,就是逐个选中 checkBox 直至全选时,经常会忘记修改全选 checkBox 的状态,某知名互联网公司的网盘就会出现这样的问题,问题 ...
- jQuery --checkbox全选和取消全选简洁高效的解决办法
最近在公司做了一个小项目,其中有一个全选和取消全选的这么一个模块,搞了半天找不到一种最佳的解决方案!后来通过各种努力找到了一种简洁高效的解决办法,这里想和大家分享一下.有问题的话,还望各路大神指导一二 ...
- jquery checkbox 全选、取消全选
$("#checkall").click(function(){ $("input[name='uid']").prop("checked" ...
- jquery checkbox全选 获取值
<style> table { line-height:35px; }</style> <div align="left" style="m ...
- jquery checkbox 全选反选代码只能执行一遍,第二次就失败
遇到问题背景: 在写到购物车的全选交互的时候,商品选中的状态只有在第一次的时候可以,第二次就无法选中:(代码如下) $(".chooseall").click(function() ...
- jQuery checkbox全选 和全部取消
1.chkAll选中,全部chk选中 ,chkAll取消选中,全部chk取消选中 //chkAll选中,全部chk选中 ,chkAll取消选中,全部chk取消选中 $("#chkAll&q ...
- JQuery checkbox全选多次点击后无效解决方法
1. jquery设置checkbox时: <input type="checkbox" id="ckAll"/> $(function(){ va ...
- 新版本的jquery checkbox 全选反选代码只能执行一遍,第二次就失败attr与prop区别
$("#all_check").click(function() { $("input[name='checkShop[]']").attr("che ...
随机推荐
- LeetCode OJ 42. Trapping Rain Water
Given n non-negative integers representing an elevation map where the width of each bar is 1, comput ...
- 评测:VPS推荐digitalocean和Vultr和Linode
美国vps推荐三家,分别是digitalocean.vultr和linode,拥有很高的性价比,中国访问速度快.我是上面三家的早期用户,并且一直使用至今,积累了不少使用经验. DigitalOcean ...
- sublime 3 最新 LICENSE
http://blog.sina.com.cn/s/blog_68e267e10102v76h.html
- Openjudge-计算概论(A)-球弹跳高度的计算
描述: 一球从某一高度落下(整数,单位米),每次落地后反跳回原来高度的一半,再落下.编程计算气球在第10次落地时,共经过多少米? 第10次反弹多高?输入输入一个整数h,表示球的初始高度.输出输出包含两 ...
- window.showModalDialog()的简单用法
//创建一个显示html内容的模态对话框: vReturnValue = window.showModalDialog(sURL [, vArguments] [,sFeatures]) //创建一个 ...
- 微信web开发工具
http://mp.weixin.qq.com/wiki/10/e5f772f4521da17fa0d7304f68b97d7e.html#.E4.B8.8B.E8.BD.BD.E5.9C.B0.E5 ...
- linux重新部署mysql和tomcat时乱码问题
mysql解决方法 vim /etc/my.cnf [client]default-character-set=utf8 [mysqld]default-storage-engine=INNODBch ...
- 网络传输中的三张表,MAC地址表、ARP缓存表以及路由表
一:MAC地址表详解 说到MAC地址表,就不得不说一下交换机的工作原理了,因为交换机是根据MAC地址表转发数据帧的.在交换机中有一张记录着局域网主机MAC地址与交换机接口的对应关系的表,交换机就是根据 ...
- MyBatis 基本数据类型条件判断问题
1.判断参数使用:_parameter <select id="findCount" parameterType="int" resultType=&qu ...
- 网络模块(net, http)小解
net模块可用来创建TCP服务器来接收网络请求,它提供了创建客户端以及服务端的方法 服务端: 创建服务器: net.createServer([,options], connectionListene ...