javascript - 如何取消选中多个选择器并使用js执行减法？

Question

我有三个下拉菜单。每次从下拉列表中选择一个项目时，它都会添加到总值中并显示在下方的标签中。当用户单击标签的“X”时，标签将被删除，并且应从下拉列表中减去该项目的值。但是，它不会被减去。

这是我有表格的链接:

https://codepen.io/MoisosxD/pen/gOPpXGQ

你看我把标签去掉是这样的:

onclick="desmarcarspan1();"

像 js 一样:

function desmarcarspan1(){
        var total = document.getElementById("totalGeneral");
        var total1 = new Array(total);
        var NuevoTotal = total.textContent;
        console.log(total.textContent);
        var ans10 = document.getElementById("ans-10");
        ans10.style.display = "none";
    }

但我没有做任何其他事情，我不知道如何进行减法和取消选中选择器。

Answer 1

如果将函数 sumValues() 设置为全局函数，则只需取消选中下拉元素并调用该函数即可:

求和值():

function sumValues() {
    const inputArray = document.querySelectorAll('input.itemTotalNeto');
    console.log(inputArray);
    const totalValue = document.querySelector('#totalGeneral');
    let cboxVals = 0;
    inputArray.forEach(element => cboxVals += element.checked ? parseInt(element.value, 10) : 0);
    totalValue.innerHTML = cboxVals;
}

desmarcspan1():

function desmarcarspan1() {

    //decheck the dropdown-element:
    document.getElementById('check-1').checked = false;

    //sum up values again
    sumValues();

    var total = document.getElementById("totalGeneral");
    var total1 = new Array(total);
    var NuevoTotal = total.textContent;
    console.log(total.textContent);
    const totalValue = document.querySelector('#totalGeneral');
    var ans1 = document.getElementById("ans-1");
    ans1.style.display = "none";
}

请看这个工作示例: https://codepen.io/PhoenixFlight/pen/eYJNMYm