javascript添加select和checkbox值///获取负数

我需要能够让用户从选择下拉列表中选择一个账单条款，然后选择复选框添加到总数中。它似乎在JSFIDLE上运行得比较好，但是在我的网站上，有些情况下，选中所有复选框，然后通过选择“选择账单期限”将总数重置为0，然后取消选中所有选项，结果会是负数。有人有什么建议吗？即使勾选和取消勾选选项也会开始出现负数

HTML:

计费周期：
选择计费期限
12个月：300美元/月（节省20%）
1个月：350美元/月。



额外功能（50美元/月）：
一款图片分享应用
审查现场监测
谷歌+
LinkedIn
品特烈
四方
Tumblr
广告
您的卡现在将收取0美元，此后您的订阅每月将收取0美元。您可以随时取消或更改计划。

我的javascript：

var select = document.getElementById('billing-price');
select.addEventListener('change', updatePrice, false);
var price = 0;
var additional = 0;

function updatePrice(e) {
    price = parseFloat(select.value);
    document.getElementById('payment-total').innerText = price + additional;
    if (price == select.options[2].value){
    document.getElementById('payment-rebill').innerText = 0 + additional; 
    } else {
    document.getElementById('payment-rebill').innerText = price + additional;
    }
}
var inputs = document.getElementsByClassName('sum'),
    total  = document.getElementById('payment-total');
    total2 = document.getElementById('payment-rebill');

for (var i=0; i < inputs.length; i++) {
    inputs[i].onchange = function() {
        var add = this.value * (this.checked ? 1 : -1);
        additional += add
        total.innerHTML = price + additional
        total2.innerHTML = price + additional
    }
}

var select=document.getElementById（'billing-price'）；
select.addEventListener（'change'，updatePrice，false）；
var价格=0；
附加var=0；
函数更新价格（e）{
price=parseFloat（选择.value）；
document.getElementById（'payment-total'）。innerText=价格+附加；
if（price==select.options[2].value）{
document.getElementById（'payment-rebill'）。innerText=0+附加；
}否则{
document.getElementById（'payment-rebill'）。innerText=价格+附加；
}
}
var inputs=document.getElementsByClassName（'sum'），
总计=document.getElementById（'payment-total'）；
total2=document.getElementById（'payment-rebill'）；
对于（变量i=0；i

正在工作的JSFIDLE:
我的站点（工作不正常）：

---

我正在为复选框使用javascript文件，以使它们具有更好的外观。我担心这可能会影响我的javascript代码中复选框的总和。

负值是由于未选中输入导致的，因此这一行中的

this.checked

var add = this.value * (this.checked ? 1 : -1);

始终为false，导致附加值为负值

将

this.checked

更改为

this.parentNode.className.split（“”）。indexOf（“checked”）>-1可能会有所帮助

for (var i=0; i < inputs.length; i++) {
    inputs[i].onchange = function() {
        var add = this.value * (this.parentNode.className.split(" ").indexOf("checked") > -1 ? 1 : -1);
        additional += add
        total.innerHTML = price + additional
        total2.innerHTML = price + additional
    }
}

for（变量i=0；i-1？1:-1）；
附加+=添加
total.innerHTML=价格+附加
total2.innerHTML=价格+附加
}
}
问题似乎是，
这个。选中的
总是错误的，除非您第一次选中该框。也许flatui-checkbox.js会影响这一点？您没有在小提琴中加载它。行
total=document.getElementById（'payment-total'）应该以
，
结尾，而不是
。当前，
total2
是一个隐式全局变量。使用或可以帮助发现这些类型的错误。您似乎只是在计算客户端的总成本，没有任何复选框具有可在后端验证的唯一名称。这是一个错误，可能会导致损失很多钱。在提交表单之前，它将是我在客户端想要的任何价格的值属性。@UselessCode我没有在网站上做任何后端操作。我只是想让前端功能正常。感谢您的关注。这个类名与flatui-checkbox.js库相关吗？是的，看起来像是库创建元素作为输入的父元素，并且已经“选中”了类名，但真正的问题是库显然覆盖了对checkbox元素本身的更改。第一次勾选此框时，
this.checked
为真，但稍后再次勾选时为假。
for (var i=0; i < inputs.length; i++) {
    inputs[i].onchange = function() {
        var add = this.value * (this.parentNode.className.split(" ").indexOf("checked") > -1 ? 1 : -1);
        additional += add
        total.innerHTML = price + additional
        total2.innerHTML = price + additional
    }
}