在做一个商城的购物车的时候遇到了一个坑, 购物车一般都有全选按钮, 再次点击就会全部消除, 在网上查到的答案全部都是使用attr来做的, 无一例外都不能用, 之后才知道要使用jquery的prop和removeProp

关于attr和prop的区别

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6.     <meta http-equiv="X-UA-Compatible" content="ie=edge">
  7.     <title>demo</title>
  8.     <script src="http://libs.baidu.com/jquery/1.9.1/jquery.min.js"></script>
  9.     <script>
  10.         $(function(){
  11.             isChecked = false;
  12.             $('#all').click(function(){
  13.                 isChecked = !isChecked;
  14.                 if(isChecked){
  15.                     $('.option').prop("checked",true)
  16.                 }else{
  17.                     $('.option').removeProp("checked")
  18.                 }
  20.             })
  21.         })
  22.     </script>
  23. </head>
  24. <body>
  25.     <input type="checkbox" value="1" class="option">1</input>
  26.     <br>
  27.     <input type="checkbox" value="2" class="option">2</input>
  28.     <br>
  29.     <input type="checkbox" value="3" class="option">3</input>
  30.     <br>
  31.     <input type="checkbox" value="4" class="option">4</input>
  32.     <br>
  33.     <input type="checkbox" value="全选" id="all">全选</input>
  34. </body>
  35. </html>

Jquery-全选和取消的一个坑的更多相关文章

  1. jQuery --checkbox全选和取消全选简洁高效的解决办法

    最近在公司做了一个小项目,其中有一个全选和取消全选的这么一个模块,搞了半天找不到一种最佳的解决方案!后来通过各种努力找到了一种简洁高效的解决办法,这里想和大家分享一下.有问题的话,还望各路大神指导一二 ...

  2. JS实现全选与取消 Jquery判断checkbox是否被选中

    1.JS实现checkbox全选与取消 <body> <input type="checkbox" name="select_all"/> ...

  3. jquery全选,取消全选

    近期项目又用到了这个全选和取消全选的操作. 曾经总是自己写纯JS.如今既然知道怎么写了.那怎样用JQ写得更简洁呢.这样也能学到新的东西.假设乎百度一下果然发现了好东东.感谢OSC的iuhoay. 代码 ...

  4. python: jquery实现全选 反选 取消

    引入这个jquery-1.12.4.js jquery实现全选 反选 取消 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitio ...

  5. jquery购物车全选，取消全选，计算总金额

    这是html代码 <div class="gwcxqbj"> <div class="gwcxd center"> <div cl ...

  6. jquery实现全选，取消，反选的功能&实现左侧菜单

    1.全选,取消,反选的例子 <!DOCTYPE html> <html lang="en"> <head> <meta charset=& ...

  7. checkbox全选和取消功能

    这是开发中常见的小功能,想当初我也曾对于attr和prop的不了解踩过坑. 前端工作中,常常会使用到select复选框,select复选框有一个属性checked,当使用js或者jquery控制这个属 ...

  8. JQuery全选Prop（“check”，true）和attr("attr",true)区别

    $scope.selectAll = false; //点击单选框的时候是不是全选 $scope.checkIsAll = function(){ var wipeCheckBoxObj = $(&q ...

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

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

随机推荐

  1. Socket实现

    网络实现架构 4.4BSD通过同时对多种通信协议的支持来提供通用的底层基础服务.4.4BSD支持四种不同的通信协议簇: TCP/IP(互联网协议簇) XNS(Xerox网络系统) OSI协议 Unix ...

  2. websocket多线程问题

    title: websocket多线程问题 date: 2017-06-28 11:21:24 categories: websocket tags: [websocket] --- 开发框架 spr ...

  3. 15套java架构师、集群、高可用、高可扩 展、高性能、高并发、性能优化Redis、ActiveMQ、Nginx、Mycat、Netty、Jvm大型分布式项目实战视频教程

    * { font-family: "Microsoft YaHei" !important } h1 { color: #FF0 } 15套java架构师.集群.高可用.高可扩 展 ...

  4. PHP数字价格格式化，保留两位小数

    number_format(($v['cash']/100),2); demo=>9,271.15

  5. ASP.NET Core Web 资源打包与压缩

    本文将介绍使用的打包和压缩的优点,以及如何在ASP.NET Core应用程序中使用这些功能. 概述 在ASP.Net中可以使用打包与压缩这两种技术来提高Web应用程序页面加载的性能.通过减少从服务器请 ...

  6. kbengine所有的demo源代码

    回复才可见的内容https://github.com/kbengine/kbengine_ue4_demo回复才可见的内容https://github.com/kbengine/kbengine_og ...

  7. Unity 游戏框架搭建 (五) 简易消息机制

    什么是消息机制? 23333333,让我先笑一会. 为什么用消息机制?   三个字,解!!!!耦!!!!合!!!!. 我的框架中的消息机制用例: 1.接收者 ``` using UnityEngine ...

  8. VIM基础知识整理(附思维导图)

    这是当时初学VIM后做的一个思维导图,图片稍大,所以从freemind导出了html文本po在下面:图片在最下方,放大可清晰浏览. VIM 普通模式 普通编辑命令 功能:浏览,普通编辑 x:删除光标所 ...

  9. （转载）IQ 16.0 SP02起支持从压缩文件直接装载数据到表中

    参考文档: http://m.blog.chinaunix.net/uid-16765068-id-4405877.htmlhttp://www.cnblogs.com/lichmama/p/4103 ...

  10. 通用JSONHelp 的通用的封装

    1. 最近项目已经上线了 ,闲暇了几天 想将JSON  的序列化 以及反序列化进行重新的封装一下本人定义为JSONHelp,虽然Microsoft 已经做的很好了.但是我想封装一套为自己开发的项目使用 ...