<html>

<head>

　　<script src="jquery-1.11.1.min.js" type="text/javascript"></script>

</head>

<body>

　　<input type="checkbox" name="chk_list[]" value="1" />1

　　<input type="checkbox" name="chk_list[]" value="2" />2

　　<input type="checkbox" name="chk_list[]" value="3" />3

　　<input type="checkbox" name="chk_list[]" value="4" />4

　　<input type="checkbox" name="chk_all" id="chk_all" />全选/取消全选

<script type="text/javascript">

　　$("#chk_all").click(function(){

    　　// 使用attr只能执行一次

    　　$("input[name='chk_list[]']").attr("checked", $(this).attr("checked")); 

    　　// 使用prop则完美实现全选和反选

    　　$("input[name='chk_list[]']").prop("checked", $(this).prop("checked"));

　　　　// 获取所有选中的项并把选中项的文本组成一个字符串
    　　var str = '';
    　　$($("input[name='chk_list[]']:checked")).each(function(){
        　　str += $(this).next().text() + ',';
    　　});
    　　alert(str);

　　});

</script>

</body>

</html>

总结：

  • 对于HTML元素本身就带有的固有属性，在处理时，使用prop方法。
  • 对于HTML元素我们自己自定义的DOM属性，在处理时，使用attr方法。
  • 参考 http://www.cnblogs.com/Showshare/p/different-between-attr-and-prop.html

jQuery全选与反选，且解决点击只执行一次的问题的更多相关文章

  1. Jquery全选与反选checkbox（代码示例）

    今天在公司要实现操作权限的功能,需要根据左边的树,选择一项,判断右边的操作权限,例如,增加,修改,删除,查看等按钮的显示与隐藏: 这个功能实现思路如下: 1.操作权限:增加.修改等按钮的ID和Text ...

  2. Jquery 全选、反选问题解析

    最近工作中,需要使用Jquery实现复选框的全选和反选,本人虽然不是专职撸前端的,但这个小问题感觉也没什么难度,下面直接上代码: <div id="list"> < ...

  3. jquery 全选、反选、获取值、背景行、隔行变色和鼠标略过变色变色全特效

    好久没有写东西了,当然不是没东西可写,只是没有时间写.今天抽出点时间来把我最近使用的一些 Javascript 特效的东西贴出来,供自己或者别人查询使用.最近我在做一个新的 B/S 系统,由于没有专门 ...

  4. jQuery 全选和反选demo

    前段时间做了一个全选和反选的功能,最近不忙了,做了一个简化版的demo. 全部代码如下: <!DOCTYPE html> <html> <head> <tit ...

  5. Jquery 全选、反选

    jQuery 1.9以后用 prop(); 不用attr 等 $(function() { $('#inputCheck').click(function() { $("input[name ...

  6. jQuery全选、反选、全不选

    原文链接:https://yq.aliyun.com/articles/33443 HTML内容部分: <ul id="items"> <li> <l ...

  7. jQuery 全选 正反选

    <script src="http://code.jquery.com/jquery-1.4.4.min.js" type="text/javascript&quo ...

  8. 基于jquery 全选、反选、各行换色、单击行选中事件实现代码

    <script language="javascript"> $(document).ready(function(){ //各行换色 $('table tr:odd' ...

  9. Jquery 全选、反选问题的记录

    <div id="list"> <ul id="choseList" > <li><input type=" ...

随机推荐

  1. C#核心基础--类(2)

    C#核心基础--类的声明 类是使用关键字 class 声明的,如下面的示例所示: 访问修饰符 class 类名 { //类成员: // Methods, properties, fields, eve ...

  2. （2）html文本格式化 解说

  3. 使用VS连接SQLServe时提示未能载入文件或程序集“System.Data.OracleClient, Version=2.0.0.0, Culture=neutral, PublicKey

    解决方法:         就是去微软主页下载两个Microsoft SQL Server 2012补丁包,SQLSysClrTypes.msi和SharedManagementObjects.msi ...

  4. c# 轻量级 ORM 框架 之 Model解析 (四)

    关于orm框架设计,还有必要说的或许就是Model解析了,也是重要的一个环节,在实现上还是相对比较简单的. Model解析,主要用到的技术是反射了,即:把类的属性与表的字段做映射. 把自己的设计及实现 ...

  5. 记一次Time-Wait导致的问题

    去年(2014年)公司决定服务框架改用Finagle(后续文章详细介绍),but 公司业务系统大部分是C#写的,然后 finagle只提供了 scala/java 的Client 于是 只能自己动手丰 ...

  6. C#中简单调用MD5方法以及MD5简介

    MD5简介:          MD5的全称是Message-Digest Algorithm 5,在90年代初由MIT的计算机科学实验室和RSA Data Security Inc发明,经MD2.M ...

  7. 王立平--EditPlus激活码

    注冊名:Free User 注冊码:6AC8D-784D8-DDZ95-B8W3A-45TFA

  8. 深入剖析 HTML5

    作为新一代的 HTML 标准,HTML5 不仅强化了 Web 网页的表现性能,还追加了本地数据库等 Web 应用的功能.虽然 HTML5 标准仍处于完善之中.然而,大部分新版本的浏览器已经能够支持某些 ...

  9. 第三方Push服务：Urban Airship

    转自:http://blog.csdn.net/kmyhy/article/details/7355756 关于推送通知,除了苹果的APNs之外,我们还有其它选择. Urban Airship就是其中 ...

  10. 深入分析 Linux 内核链表--转

    引用地址:http://www.ibm.com/developerworks/cn/linux/kernel/l-chain/index.html 一. 链表数据结构简介 链表是一种常用的组织有序数据 ...