一个网上很多的例子如下：

  1.     <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2.     <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
  3.     <head>
  4.         <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
  5.         <title>test</title>
  6.         <script type="text/javascript" src="jquery-1.9.1.js"></script>
  7.         <script type="text/javascript">
  8.         $(function () {
  9.             // 全选
  10.             $("#btnCheckAll").bind("click", function () {
  11.                 $("[name = chkItem]:checkbox").attr("checked", true);
  12.             });
  14.             // 全不选
  15.             $("#btnCheckNone").bind("click", function () {
  16.                 $("[name = chkItem]:checkbox").attr("checked", false);
  17.             });
  19.             // 反选
  20.             $("#btnCheckReverse").bind("click", function () {
  21.                 $("[name = chkItem]:checkbox").each(function () {
  22.                     $(this).attr("checked", !$(this).attr("checked"));
  23.                 });
  24.             });
  26.             // 全不选
  27.             $("#btnSubmit").bind("click", function () {
  28.                 var result = new Array();
  29.                 $("[name = chkItem]:checkbox").each(function () {
  30.                     if ($(this).is(":checked")) {
  31.                         result.push($(this).attr("value"));
  32.                     }
  33.                 });
  35.                 alert(result.join(","));
  36.             });
  37.         });
  38.     </script>
  39. </head>
  40. <body>
  41.     <div>
  42.         <input name="chkItem" type="checkbox" value="今日话题" />今日话题
  43.         <input name="chkItem" type="checkbox" value="视觉焦点" />视觉焦点
  44.         <input name="chkItem" type="checkbox" value="财经" />财经
  45.         <input name="chkItem" type="checkbox" value="汽车" />汽车
  46.         <input name="chkItem" type="checkbox" value="科技" />科技
  47.         <input name="chkItem" type="checkbox" value="房产" />房产
  48.         <input name="chkItem" type="checkbox" value="旅游" />旅游
  49.     </div>
  50.     <div>
  51.         <input id="btnCheckAll" type="button" value="全选" />
  52.         <input id="btnCheckNone" type="button" value="全不选" />
  53.         <input id="btnCheckReverse" type="button" value="反选" />
  54.         <input id="btnSubmit" type="button" value="提交" />
  55.     </div>
  56. </body>
  57. </html>

运行后，在火狐下面发现一个问题百思不得其解 
问题描述：第一次点全选可以，然后点击全不选，接着再点击全选、全不选、反选就没了反应，后来用其他浏览器发下可以，所以感觉是兼容性的问题，后来查阅资料发现果然是的，参考地址http://jquery.com/ 
解决方法：将attr换为prop即可，经过验证各个浏览器都是好的，官网说明是在1.6之后建议用prop，在此记录以备后用 
下为效果图 

jquery中checkbox选中的问题之prop&attr惹的祸的更多相关文章

  1. jquery中checkbox全选失效的解决方法

    这篇文章主要介绍了jquery中checkbox全选失效的解决方法,需要的朋友可以参考下     如果你使用jQuery 1.6 ,代码if ( $(elem).attr(“checked”) ),将 ...

  2. jQuery获取checkbox选中项等操作及注意事项

    jQuery获取checkbox选中项等操作及注意事项 今天在做一个项目功能时需要显示checkbox选项来让用户进行选择,由于前端不是很熟练,所以做了一个简单的Demo,其中遇到一些小问题,特记录下 ...

  3. JQuery中checkbox选择器

    今天我们讲的是如何选择HTML网页中CheckBox选择器 如下图,是几个checkbox <input type='checkbox'checked="checked"/& ...

  4. JQuery设置checkbox选中或取消等相关操作

    $("[name='checkbox']").attr("checked",'true');//全选 $("[name='checkbox']&quo ...

  5. jQuery对checkbox选中和取消选中操作

    最近做项目发现jQuery对checkbox的全选和非全选操作只有第一次生效,以后就不生效了,不知道是不是jQuery版本库的问题,最终找到了一个解决方案: 把原来的下面这两句: $('input') ...

  6. jquery中checkbox的选中，反选，全不选 注意1.6版本以上将attr改成prop

    <script type="text/javascript"> $(function () { // 全选 $("#btnCheckAll").bi ...

  7. jQuery控制checkbox选中状态但是不显示选中

    问题描述:使用jQuery来控制checkbox的选中状态,但是第一次点击出现选中样式,之后点击可以看到checked的属性增加成功但是并没有选 中状态. 问题代码: function chooseA ...

  8. jquery中CheckBox的checked状态用attr()的问题

    写了一个脚本,点按钮时选中checkbox,前几次可以选中,多点几次发现checkbox并未选中,调试后发现checked状态根本没有改变,后在网上查证与attr()函数有关,后改为prop问题解决. ...

  9. Jquery判断checkbox选中状态

    jQuery v3.3.1 <input type="checkbox" id="ch"> 判断 $('#ch').is(':checked'); ...

随机推荐

  1. [maven] 使用Nexus创建maven私有仓库

    1.为什么需要maven私有仓库? 从Maven中央仓库下载所需的jar包,需要外网的支持.如果公司不能上外网的话则不能从中央仓库下载所需jar包,公司网速慢的时候也会影响项目构建的速度.用户可以用n ...

  2. Load Runner11录制脚本出现乱码的解决方法

    方法一: 1.录制的脚本出现乱码 Go to Vugen -> Tools -> Recording Options -> Advancedb)   Check the option ...

  3. String课后作业

    请查看String.equals()方法的实现代码,注意学习其实现方法. public class StringEquals { @param args the command line argume ...

  4. javaee包含的服务和组件

    参考自 http://blog.itpub.net/29990276/viewspace-1318551/

  5. 关于Elasticsearch单个索引文档最大数量问题

    因为ElasticSearch是一个基于Lucene的搜索服务器.Lucene的索引有个难以克服的限制,导致Elasticsearch的单个分片存在最大文档数量限制,一个索引分片的最大文档数量是20亿 ...

  6. HDU 1402 fft 模板题

    题目就是求一个大数的乘法 这里数字的位数有50000的长度,按平时的乘法方式计算,每一位相乘是要n^2的复杂度的,这肯定不行 我们可以将每一位分解后作为系数,如153 = 1*x^2 + 5*x^1 ...

  7. CentOS6.4安装Hadoop2.0.5 alpha - Single Node Cluster

    1.安装JDK7 rpm到/usr/java/jdk1.7.0_40,并建立软链接/usr/java/default到/usr/java/jdk1.7.0_40 [root@server-308 ~] ...

  8. 【转】解决编译安装NGINX时make报错

    编译参数:--[root@localhostnginx-1.4.6]#./configure--user=nginx--group=nginx--prefix=/usr/local/nginx--wi ...

  9. 初学JavaScript七大注意事项

    知识说明: 初学JavaScript,注意以下七大细节,在实现同样功能的情况下,让我们的代码更易懂.效率更高. 一.简化代码 例如:创建对象 之前是这样的: Var car = new object( ...

  10. BlackHat会议上将公布一款免费的汽车黑客工具

    汽车,无可厚非是现代社会很重要的交通工具,但与此同时却也带来了诸多安全隐患,不管怎样,汽车安全都是我们不可忽视的一个重大问题. 即将免费分享该工具 近日一名法国研究者将发布一款检测汽车安全漏洞的工具, ...