{__NOLAYOUT__}
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script type="text/javascript" src="__STATIC__/index_style/js/jquery-2.2.0.min.js" ></script>
</head>
<body>
<table border="1">
<tr>
<th>
全选/全不选<br>
<input type="checkbox" id="choose">
</th>
<th>商品图片</th>
<th>商品名称</th>
<th>商品单价</th>
<th>商品数量</th>
<th>商品小计</th>
</tr>
{volist name="data" id="v" key="k"}
<tr>
<td><input type="checkbox" class="cho"></td>
<td><img src="__STATIC__/uploads/{$v.goods_img}" width="100" height="100"></td>
<td>{$v.goods_name}</td>
<td>{$v.goods_price}</td>
<td>
<button type="button" class="jia">+</button>
<span>{$v.num}</span>
<button type="button" class="jian">-</button>
</td>
<td class="count_price">{$v.count_price}</td>
</tr>
{/volist}
</table>
总价：￥<span id="zongjia">0</span>
</body>
</html>
<script>
//多选框的点击事件
$('.cho').click(function(){
sum_price();
})
//计算总价
function sum_price(){
var sum=0
var obj = $("input[class=cho]");
for (var i = 0; i < obj.length; i++) {
if(obj[i]['checked']){
sum+=Number($(obj[i]).parents("tr").find('.count_price').text());
}
}
$("#zongjia").text(sum);
}
//加号事件
$(".jia").click(function(){
//单价
var one_price = Number($(this).parent().prev().text());
//计算数量
var num = Number($(this).next()[0]['textContent']);
num = num+1;
//数量替换
$(this).next().text(num)
//小计
xiaoji = num*one_price;
//替换
$(this).parent().next().text(xiaoji)
sum_price()
})
//减号事件
$(".jian").click(function(){
//单价
var one_price = Number($(this).parent().prev().text());
//计算数量
var num = Number($(this).prev()[0]['textContent']);
num = num-1 <= 0 ? 1: num-1;
//数量替换
$(this).prev().text(num)
//小计
xiaoji = num*one_price;
//替换
$(this).parent().next().text(xiaoji)
sum_price()
})
</script>
