Javascript 将多个元素的值添加或减去总值

因此，我做了一个函数，可以在“购物车”中更改我的值。每个输入字段都有一个值，在输入字段发生变化时，该值会在其总数上加上或减去。看起来是这样的：

我的代码如下所示（是的，我稍后将清理html+css，这只是为了测试：-）：

var extraValues=document.querySelectorAll（“输入[type=number]”）；
var extraTotal=0；
Array.prototype.forEach.call（extraValue，函数（extraValue）{
addEventListener（'change'，function（））{
var getExtraId=extraValue.id；
var extraLength=getExtraId.length；
var currentExtra=getExtraId.charAt（extraLength-1）；
var catId=“testKassabon”+currentExtra；
var extraSort=extraValue.parentElement.querySelector（'label'）；
var extraPrice=extraValue.parentElement.querySelector（'.extraPrice'）.innerText；
var totalPrice=extraPrice*this.value；
var showExtra=document.getElementById（catId）；
showExtra.innerHTML=“”+this.value+“x”+extraSort.innerText+“€”+总价+”；
})
});
.col表单标签{
字号：700；
显示：块；
宽度：100%；
垫底：5px；
}

7.50
3-gangendiner
10
封地
2.50
Uitgebreid Ontbijt自助餐厅
Uw totaalprijs酒店
解决方案
在这个解决方案中，我添加了一个函数来计算总和

因此，当值发生变化时，我会在函数末尾调用。
计算器
，用于计算总和并将其插入文本字段中


var extraValues=document.querySelectorAll（“输入[type=number]”）；
//extraValues.forEach（（elem）=>{
//元素addEventListener（“输入”，函数（evt）{
//计算器（）；
//  })
//  });
Array.prototype.forEach.call（extraValue，函数（extraValue）{
addEventListener（'change'，function（））{
var getExtraId=extraValue.id；
var extraLength=getExtraId.length；
var currentExtra=getExtraId.charAt（extraLength-1）；
var catId=“testKassabon”+currentExtra；
var extraSort=extraValue.parentElement.querySelector（'label'）；
var extraPrice=extraValue.parentElement.querySelector（'.extraPrice'）.innerText；
var totalPrice=extraPrice*this.value；
var showExtra=document.getElementById（catId）；
showExtra.innerHTML=“”+this.value+“x”+extraSort.innerText+“€”+总价+”；
计算器（）
})
});
函数计算器（）{
让价格=document.querySelectorAll（“.extraPrice”）
设和=0；
设fac=0；
extraValues.forEach（（元素，索引）=>{
fac=parseFloat（价格[ind].innerHTML）
总和+=parseInt（元素值）*fac；
})
document.getElementById（“totalPrice”）.innerHTML=sum；
}
.col表单标签{
字号：700；
显示：块；
宽度：100%；
垫底：5px；
}

7.50
3-gangendiner
10
封地
2.50
Uitgebreid Ontbijt自助餐厅
Uw totaalprijs酒店
试试这个密码员谢谢：-）



函数属性（obj）{
var计数=0；
用于（obj中的var prop）{
控制台日志（道具，obj）
if（对象拥有自己的财产（财产））
计数=计数+对象[prop]；
} 
返回计数；
}
变量总数={}
var extraValues=document.querySelectorAll（“输入[type=number]”）；
var extraTotal=0；
Array.prototype.forEach.call（extraValue，函数（extraValue）{
addEventListener（'change'，function（））{
var getExtraId=extraValue.id；
var extraLength=getExtraId.length；
var currentExtra=getExtraId.charAt（extraLength-1）；
var catId=“testKassabon”+currentExtra；
var extraSort=extraValue.parentElement.querySelector（'label'）；
var extraPrice=extraValue.parentElement.querySelector（'.extraPrice'）.innerText；
var totalPrice=extraPrice*this.value；
总计[catId]=总价
//var TotalCost=Object.Value（total）.reduce（（a，b）/=>a+b，0）
var TotalCost=countProperties（总计）
console.log（总成本）
警报（总成本）
var showExtra=document.getElementById（catId）；
showExtra.innerHTML=“”+this.value+“x”+extraSort.innerText+“€”+总价+”；
})
});
.col表单标签{
字号：700；
显示：块；
宽度：100%；
垫底：5px；
}

7.50
3-gangendiner
10
封地