//页面的展示
{__NOLAYOUT__}
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="__STATIC__/jq.js"></script>
</head>
<body>
<table border="1">
<tr>
<td>多选
<input type="checkbox" class="choose">
</td>
<td>用户名</td>
<td>密码</td>
<td>数量</td>
<td>单价</td>
<td>总价</td>
</tr>
{volist name="data" id="v"}
<tr>
<td><input type="checkbox" class="cho"></td>
<td>{$v.uname}</td>
<td>{$v.upwd}</td>
<td>
<button class="jia">+</button>
<span>{$v.num}</span>
<button class="jian">-</button>
</td>
<td>{$v.goods_price}</td>
<td class="count_price">{$v.count_price}</td>
</tr>
{/volist}
</table>
总计：￥<span id="zongjia">0</span>
</body>
</html>
//多选框的点击事件 jquery 的展示
$('.cho').click(function(){
sum_price();
})
//计算总价
function sum_price(){
var sum=0
var obj = $("input[class=cho]");
for (var i=0;i<obj.length;i++){
//一级元素 input 二级元素 checked（个人理解）
if(obj[i]['checked']){
sum+=Number($(obj[i]).parents("tr").find('.count_price').text());
}
}
$("#zongjia").text(sum);
}
//加号的运用
$(".jia").click(function () {
//获取当前的购买数量
var num=Number($(this).next().text());
num+=1;
$(this).next().text(num);
//获取单价
var one_price=Number($(this).parent().next().text());
//总价等于单价乘以数量
var count=num*one_price;
//获取总价
$(this).parent().next().next().text(count)
sum_price();
});
//减号的运用
$(".jian").click(function () {
//获取当前的购买数量
var num=Number($(this).prev().text());
num=num-1<1?1:num-1;
$(this).prev().text(num);
//获取单价
var one_price=Number($(this).parent().next().text());
//总价等于单价乘以数量
var count=num*one_price;
$(this).parent().next().next().text(count)
sum_price()
});