您的位置:首页 > 移动开发

appcan 多个列表购物车加减数量例子

2015-06-08 10:14 381 查看
html代码如下:
<div class="uinn4 white" id="listview">
<ul>
<!--------列表循环---->
<li class="ubb ub bc-border t-bla ub-ac lis" data-index="0">
<div class="checkbox umar-r">
<input type="checkbox" class="uabs ub-con" />
</div>
<ul class="ub ub ub-ver">
<li class="">
<div class="lis-icon ub-img" style="background-image:url(images/shopping_list.png)"></div>
<div class="ulev-1 bc-text umar-t"></div></li>
</ul>
<ul class="ub-f1 ub ub-pj ub-ac">
<ul class="ub-f1 ub ub-ver marg-l">
<li class="bc-text ub ub-ver ut-m line1"><span class="pro_name">联想笔记本</span><br />规格:<span class="code">Y430P</span><br />积分值:<span class="red jifen">28800</span></li>
<li class="ulev-1 sc-text1 uinn3">
<div class="ub ub-ac">
<div class="ub-f1 t-gra3 ulev-3">
数量
</div>
<div class="ub ub-f3">
<div class="minus uwh-pSC1 tx-c uba bc-border uc-a-app1 t-bla mar-ar1">
-
</div>
<div class="uba uc-a-app1 bc-border uinput uwh-pSC1 mar-ar1 c-wh">
<input value="1" type="text" class="uinn-pSC3 t-bla tx-c" />
</div>
<div class="plus uwh-pSC1 tx-c uba bc-border uc-a-app1 t-bla">
+
</div>
</div>
</div> </li>
</ul>
</ul></li>
<!-------列表循环结束----->
</ul>
</div>

对于这种多个要更改多个input的值,可以用this的值来获取到相应的input。

加:

$(".plus").click(function(){
var t=$(this).parent().find('input.tx-c');
t.val(parseInt(t.val())+1);
//setTotal();
})

减:
$(".minus").click(function(){
var t=$(this).parent().find('input.tx-c');
t.val(parseInt(t.val())-1)
if(parseInt(t.val())<0){
t.val(0);
alert("数量已经是0");
}
//setTotal();
})

计算总金额:
/*function setTotal(){
var s=0;
$("#listview li.lis").each(function(){
s+=parseInt($(this).find('input.tx-c').val())*parseFloat($(this).find('span.jifen]').text());
});
$("#total").html(s.toFixed(2));
}
setTotal();
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息