要求：
1.实现全选和全部选的功能。当商品被选中时，需要计算选择的商品数量和总计
2实现数量的加一或者减一。当数量改变时，需要重新计算小计；如果该商品 被选中，则需要重新计算商品数量和总计。注意：商品数量不能小于 1
3.单击“删除”按钮后，删除列表中的该条数据
css样式
html
js代码
<script>
//删除
function del(e){
e.parentNode.parentNode.parentNode.removeChild(e.parentNode.parentNode);
}
//复选框
//获取总复选框
var box= document.getElementById("box");
//获取其他复选框
var xuan = document.getElementsByName("xuan");
function dian(){
if(box.checked){
for (var i = 0; i < xuan.length; i++) {
xuan[i].checked =true;
}
}else{
for (var i = 0; i < xuan.length; i++) {
xuan[i].checked =false;
}
}
zong();
}
//反选
var flag = false;
function fan(e){
for (var i = 0; i < xuan.length; i++) {
if(!xuan[i].checked){
flag =false;
break;
}
}
if(!flag){
box.checked =false;
}else{
box.checked =true;
}
zong();
}
//加
//获取
function jia(e){
var aa= e.nextSibling.nextSibling;
var num= aa.value;
num++;
aa.value = num;
//获取单价
var price= e.parentNode.previousSibling.previousSibling.childNodes[0].value;
//获取小计
e.parentNode.nextSibling.nextSibling.childNodes[1].value = price*num;
zong();
}
//减
function jian(e){
var aa =e.previousSibling.previousSibling;
var num = aa.value;
num--;
if(num<0){
alert("不要在减了");
num=0;
}
aa.value = num;
//获取单价
var price= e.parentNode.previousSibling.previousSibling.childNodes[0].value;
//获取小计
e.parentNode.nextSibling.nextSibling.childNodes[1].value = price*num;
zong();
}
//获取总计
var nums = document.getElementById("nums");
//获取总数量
var count = document.getElementById("count");
//获取所有单价
var prices = document.getElementsByName("price");
//获取所有数量
var shus =document.getElementsByName("shu");
function zong(){
var sum = 0;
var sumqian=0;
for (var i = 0; i < xuan.length; i++) {
if(xuan[i].checked){
sum+=Number(shus[i].value);
sumqian+=prices[i].value*shus[i].value;
}
}
console.log(sum);
console.log(sumqian);
nums.innerHTML = sum;
count.innerHTML=sumqian;
}
//失去焦点事件
for (var i = 0; i < shus.length; i++) {
shus[i].οnblur= function(){
zong();
}
}
</script>