div包裹下购物车加减功能


 
<div class="weui-panel weui-panel_access">
    <div class="weui-panel__hd"><span>江苏蓝之蓝旗舰店</span><a href="javascript:;" class="wy-dele"></a></div>
    <div class="weui-panel__bd">
      <div class="weui-media-box_appmsg pd-10">
        <div class="weui-media-box__hd check-w weui-cells_checkbox">
          <label class="weui-check__label" for="cart-pto4">
            <div class="weui-cell__hd cat-check"><input type="checkbox" class="weui-check" name="cartpro" id="cart-pto4"><i class="weui-icon-checked"/></i></div>
          </label>
        </div>
        <div class="weui-media-box__hd"><a href="pro_info.html"><img class="weui-media-box__thumb" src="../upload/pro3.jpg" alt="" /></a></div>
        <div class="weui-media-box__bd">
          <h1 class="weui-media-box__desc"><a href="pro_info.html" class="ord-pro-link">蓝之蓝蓝色瓶装经典Q7浓香型白酒500ml52度高端纯粮食酒2瓶装包邮</a></h1>
          <p class="weui-media-box__desc">规格：<span>红色</span>，<span>23</span></p>
          <div class="clear mg-t-10">
            <div class="wy-pro-pri fl">¥<em class="num font-15">296.00</em></div>
            <div class="pro-amount fr"><div class="Spinner"></div>
<a class="DisDe" href="javascript:void(0)"><i>-</i></a>
                    <input class="Amount" value="1" autocomplete="off" maxlength="3"><a class="Increase" href="javascript:void(0)"><i>+</i></a></div></div>
          </div>
        </div>
      </div>
    </div>
  </div>
 
  <div class="weui-panel weui-panel_access">
    <div class="weui-panel__hd"><span>江苏蓝之蓝旗舰店</span><a href="javascript:;" class="wy-dele"></a></div>
    <div class="weui-panel__bd">
      <div class="weui-media-box_appmsg pd-10">
        <div class="weui-media-box__hd check-w weui-cells_checkbox">
          <label class="weui-check__label" for="cart-pto4">
            <div class="weui-cell__hd cat-check"><input type="checkbox" class="weui-check" name="cartpro" id="cart-pto4"><i class="weui-icon-checked"/></i></div>
          </label>
        </div>
        <div class="weui-media-box__hd"><a href="pro_info.html"><img class="weui-media-box__thumb" src="../upload/pro3.jpg" alt="" /></a></div>
        <div class="weui-media-box__bd">
          <h1 class="weui-media-box__desc"><a href="pro_info.html" class="ord-pro-link">蓝之蓝蓝色瓶装经典Q7浓香型白酒500ml52度高端纯粮食酒2瓶装包邮</a></h1>
          <p class="weui-media-box__desc">规格：<span>红色</span>，<span>23</span></p>
          <div class="clear mg-t-10">
            <div class="wy-pro-pri fl">¥<em class="num font-15">296.00</em></div>
            <div class="pro-amount fr"><div class="Spinner"></div><a class="DisDe" href="javascript:void(0)"><i>-</i></a>
                    <input class="Amount" value="1" autocomplete="off" maxlength="3"><a class="Increase" href="javascript:void(0)"><i>+</i></a></div></div>
          </div>
        </div>
      </div>
    </div>
  </div>
 
  <div class="weui-panel weui-panel_access">
    <div class="weui-panel__hd"><span>江苏蓝之蓝旗舰店</span><a href="javascript:;" class="wy-dele"></a></div>
    <div class="weui-panel__bd">
      <div class="weui-media-box_appmsg pd-10">
        <div class="weui-media-box__hd check-w weui-cells_checkbox">
          <label class="weui-check__label" for="cart-pto4">
            <div class="weui-cell__hd cat-check"><input type="checkbox" class="weui-check" name="cartpro" id="cart-pto4"><i class="weui-icon-checked"/></i></div>
          </label>
        </div>
        <div class="weui-media-box__hd"><a href="pro_info.html"><img class="weui-media-box__thumb" src="../upload/pro3.jpg" alt="" /></a></div>
        <div class="weui-media-box__bd">
          <h1 class="weui-media-box__desc"><a href="pro_info.html" class="ord-pro-link">蓝之蓝蓝色瓶装经典Q7浓香型白酒500ml52度高端纯粮食酒2瓶装包邮</a></h1>
          <p class="weui-media-box__desc">规格：<span>红色</span>，<span>23</span></p>
          <div class="clear mg-t-10">
            <div class="wy-pro-pri fl">¥<em class="num font-15">296.00</em></div>
            <div class="pro-amount fr"><div class="Spinner"></div><a class="DisDe" href="javascript:void(0)"><i>-</i></a>
                    <input class="Amount" value="1" autocomplete="off" maxlength="3"><a class="Increase" href="javascript:void(0)"><i>+</i></a></div></div>
          </div>
        </div>
      </div>
    </div>
  </div>
  
<div class="weui-panel weui-panel_access">
    <div class="weui-panel__hd"><span>江苏蓝之蓝旗舰店</span><a href="javascript:;" class="wy-dele"></a></div>
    <div class="weui-panel__bd">
      <div class="weui-media-box_appmsg pd-10">
        <div class="weui-media-box__hd check-w weui-cells_checkbox">
          <label class="weui-check__label" for="cart-pto4">
            <div class="weui-cell__hd cat-check"><input type="checkbox" class="weui-check" name="cartpro" id="cart-pto4"><i class="weui-icon-checked"/></i></div>
          </label>
        </div>
        <div class="weui-media-box__hd"><a href="pro_info.html"><img class="weui-media-box__thumb" src="../upload/pro3.jpg" alt="" /></a></div>
        <div class="weui-media-box__bd">
          <h1 class="weui-media-box__desc"><a href="pro_info.html" class="ord-pro-link">蓝之蓝蓝色瓶装经典Q7浓香型白酒500ml52度高端纯粮食酒2瓶装包邮</a></h1>
          <p class="weui-media-box__desc">规格：<span>红色</span>，<span>23</span></p>
          <div class="clear mg-t-10">
            <div class="wy-pro-pri fl">¥<em class="num font-15">296.00</em></div>
            <div class="pro-amount fr"><div class="Spinner"></div>
<a class="DisDe" href="javascript:void(0)"><i>-</i></a>
                    <input class="Amount" value="1" autocomplete="off" maxlength="3"><a class="Increase" href="javascript:void(0)"><i>+</i></a></div></div>
          </div>
        </div>
      </div>
    </div>
  </div>
 
  <div class="weui-panel weui-panel_access">
    <div class="weui-panel__hd"><span>江苏蓝之蓝旗舰店</span><a href="javascript:;" class="wy-dele"></a></div>
    <div class="weui-panel__bd">
      <div class="weui-media-box_appmsg pd-10">
        <div class="weui-media-box__hd check-w weui-cells_checkbox">
          <label class="weui-check__label" for="cart-pto4">
            <div class="weui-cell__hd cat-check"><input type="checkbox" class="weui-check" name="cartpro" id="cart-pto4"><i class="weui-icon-checked"/></i></div>
          </label>
        </div>
        <div class="weui-media-box__hd"><a href="pro_info.html"><img class="weui-media-box__thumb" src="../upload/pro3.jpg" alt="" /></a></div>
        <div class="weui-media-box__bd">
          <h1 class="weui-media-box__desc"><a href="pro_info.html" class="ord-pro-link">蓝之蓝蓝色瓶装经典Q7浓香型白酒500ml52度高端纯粮食酒2瓶装包邮</a></h1>
          <p class="weui-media-box__desc">规格：<span>红色</span>，<span>23</span></p>
          <div class="clear mg-t-10">
            <div class="wy-pro-pri fl">¥<em class="num font-15">296.00</em></div>
            <div class="pro-amount fr"><div class="Spinner"></div><a class="DisDe" href="javascript:void(0)"><i>-</i></a>
                    <input class="Amount" value="1" autocomplete="off" maxlength="3"><a class="Increase" href="javascript:void(0)"><i>+</i></a></div></div>
          </div>
        </div>
      </div>
    </div>
  </div>
 
  <div class="weui-panel weui-panel_access">
    <div class="weui-panel__hd"><span>江苏蓝之蓝旗舰店</span><a href="javascript:;" class="wy-dele"></a></div>
    <div class="weui-panel__bd">
      <div class="weui-media-box_appmsg pd-10">
        <div class="weui-media-box__hd check-w weui-cells_checkbox">
          <label class="weui-check__label" for="cart-pto4">
            <div class="weui-cell__hd cat-check"><input type="checkbox" class="weui-check" name="cartpro" id="cart-pto4"><i class="weui-icon-checked"/></i></div>
          </label>
        </div>
        <div class="weui-media-box__hd"><a href="pro_info.html"><img class="weui-media-box__thumb" src="../upload/pro3.jpg" alt="" /></a></div>
        <div class="weui-media-box__bd">
          <h1 class="weui-media-box__desc"><a href="pro_info.html" class="ord-pro-link">蓝之蓝蓝色瓶装经典Q7浓香型白酒500ml52度高端纯粮食酒2瓶装包邮</a></h1>
          <p class="weui-media-box__desc">规格：<span>红色</span>，<span>23</span></p>
          <div class="clear mg-t-10">
            <div class="wy-pro-pri fl">¥<em class="num font-15">296.00</em></div>
            <div class="pro-amount fr"><div class="Spinner"></div><a class="DisDe" href="javascript:void(0)"><i>-</i></a>
                    <input class="Amount" value="1" autocomplete="off" maxlength="3"><a class="Increase" href="javascript:void(0)"><i>+</i></a></div></div>
          </div>
        </div>
      </div>
    </div>
  </div>

这种div包裹的情况下，如何获取是哪个复选框被选中，并获取对应的单价和数量，取消复选框也可以实现，大概就是一个购物车加减的功能

写回答
好问题 0 提建议
追加酬金
关注问题
分享
邀请回答
编辑收藏删除
收藏举报

2条回答默认最新

一把编程的菜刀 2022-11-18 08:56

关注

$('.weui-check').click(function(){//单击一个复选框选中或者取消
    var allnum=0;//所有数量之和
    var allprice=0;//所有价格之和    
    $("input[name='cartpro']:checked").each(function () {//循环所有选中的复选框数量相加
        var obj=$(this).parent().parent().parent().parent();
          allnum=allnum+obj.find('.Amount').eq(0).val();
          allprice=allprice+parseInt(obj.find('.num').eq(0).html());
    });
})
$('.allcheck').click(function(){//单击全选或者取消选中
    var allnum=0;//所有数量之和
    var allprice=0;//所有价格之和
    if(this.checked){//单击全选选中
        $(".weui-check").attr("checked", true);
         $(".Amount").each(function () {//循环所有数量相加
            allnum=allnum+$(this).val();
         });
        $(".num").each(function () {//循环所有价格相加
            allprice=allprice+parseInt($(this).html());
         });
    }else{//全部取消选中
        $(".weui-check").attr("checked", false);
    }
})

本回答被题主选为最佳回答 , 对您是否有帮助呢?

查看更多回答(1条)

报告相同问题？

关注问题

javascript编程语言怎么实现拖动div并且保存div的布局 javascript
2018-07-23 03:39

回答 3 已采纳 [拖动并且保存位置](http://www.w3dev.cn/download/20090623/drag-save-position.aspx "")
如何使用Go编程语言对文件名进行排序？
2019-03-12 15:42

回答 2 已采纳 Based on comments, it appears that the question is "How to print files where the file has a .json
如何用JS获取div下的子div javascript
2015-09-01 03:07

回答 3 已采纳 ``` 无标题文档 sdfsdf ssssssss ```
前端面试题----百题大战(超详细哦,包含代码和示例哦,记得一键三连哦,持续更新中ing...)
2023-04-04 14:24

～眸的博客 Vue.js：Vue.js 是一个渐进式 JavaScript 框架，它通过组合各种特性和插件，支持更加灵活的功能开发和定制化，而且拥有较小的体积和高效的性能。Vue.js 的优点包括易学易用、高效快速、灵活可定制、支持服务器渲染等...
高手请教，移动端编程如何让iframe填充整个div？ html5
2016-07-25 10:00

回答 2 已采纳设置iframe宽高。或iframe100%
如何给一个div右上角加一个删除图标 css css3 html5
2020-08-14 09:20

回答 1 已采纳把下面“删除”2个字替换成你的删除图片 ```
javascrpt语言里怎么实现div点击以后通过文本框给它更新的功能，html的实现？ html5
2018-07-25 08:12

回答 3 已采纳 ``` ```
【Java面试大总结】历时两个多月的Java面试大总结_本人亲历（附答案）
2022-03-01 20:52

Willing卡卡的博客实际上新加子类更容易获得多态功能。例如，在实现了圆锥、半圆锥以及半球体的多态基础上，很容易增添球体类的多态性。接口性：多态是超类通过方法签名，向子类提供了一个共同接口，由子类来完善或者覆盖它而实现的...
如何获得go语言功能的注释？
2016-05-27 16:38

回答 2 已采纳 Short answer, there is no native support for annotations in Golang. What's being used if tags, whi
小白请问下这个页面布局的问题？div css css
2017-06-19 01:37

回答 2 已采纳 ``` #footer{position: absolute;bottom:0px;} //or #footer{position: fixed;bottom:0px;} ```
js获取key和value值到div下 javascript json
2018-11-08 09:09

回答 4 已采纳 ES6代码： for(let i=0;i<cus.length;i++){ for(let tmp of cus[i]){ console.log(tmp+'-'+cus[i].tm
React编程-组件开发(五)
2021-05-10 16:06

无处安放的波澜的博客 //引入样式代码 import "./css/base.css" class Button extends React.Component{ render(){ return ( <div> ,fontSize:"20px"}}>蜗牛学院</h1> <div className="as" id="show"></div> </div> ) } } 在上面代码中，...
JS如何获取某个div下存在多少个子div javascript
2016-11-30 05:29

回答 4 已采纳 ``` ``` ``` ggggg
JavaScript 学习笔记超详细（b站pink老师）
2023-05-10 17:24

zhuie_的博客是一种运行在客户端（浏览器）的编程语言，实现人机交互效果。2. 作用（做什么？– 网页特效 (监听用户的一些行为让网页作出对应的反馈)– 表单验证 (针对表单数据的合法性进行判断)– 数据交互 (获取后台的数据, ...
2023前端面试题汇总
2023-03-09 17:58

下雪不过冬天的博客当并列书写多个div标签，它们会纵向向下排位，如果我们想将多个div并列成一排，就得借助position，float，或display属性，这便是传统的盒模型做法。而flex布局则是一种新的布局方案，通过为修改父div的display属性...
没有解决我的问题, 去提问

问题事件

关注

码龄粉丝数原力等级 --

被采纳

被点赞

采纳率
系统已结题 11月26日
关注

码龄粉丝数原力等级 --

被采纳

被点赞

采纳率
已采纳回答 11月18日
关注

码龄粉丝数原力等级 --

被采纳

被点赞

采纳率
创建了问题 11月18日

悬赏问题

¥15 用stata实现聚类的代码
¥15 请问paddlehub能支持移动端开发吗？在Android studio上该如何部署？
¥170 如图所示配置eNSP
¥20 docker里部署springboot项目，访问不到扬声器
¥15 netty整合springboot之后自动重连失效
¥15 悬赏！微信开发者工具报错，求帮改
¥20 wireshark抓不到vlan
¥20 关于#stm32#的问题：需要指导自动酸碱滴定仪的原理图程序代码及仿真
¥20 设计一款异域新娘的视频相亲软件需要哪些技术支持
¥15 stata安慰剂检验作图但是真实值不出现在图上

div包裹下购物车加减功能

2条回答 默认 最新

问题事件

悬赏问题

2条回答默认最新