Question

我有这个jsFiddle工作得非常好，我正在尝试使用jQuery和选择框来计算产品的总价。

我有一个问题，但是当选择“黑寡妇”的第二个选项时，数据值会根据第一个选择框中选择的内容进行更新。

数据值为100（选择1x12机柜时）
数据值为200（选择2x12机柜时）
数据值为400（选择4x12机柜时）

这一切都正确更新（我已经检查过Chrome Inspect并且数据值正在更新），但是，一旦选择了黑寡妇选项，总价格就会拒绝动态更新。

任何人都可以澄清为什么会这样吗？每次更改选项时，有没有办法重新加载updateTotal变量？我认为这是它正在做的但显然不是。

这是我的js：

//Calculate Total Price
    $("select[name='options']").change(function() { 
        updateTotal(); 
    });

//Function for price calculator
function updateTotal() {
    var newTotal = 0;
    $("select[name='options'] option:selected").each(function() {
        newTotal += parseFloat($(this).data('value'));
    });
    $(".total").text(newTotal);
}

谢谢！

Answer 1

改变这个：

$(".widow").attr('data-value', price[$(this).val()]);

对此：

$(".widow").data('value', price[$(this).val()]);

请参阅updated Fiddle

如何使用jquery动态更新总价？

1 个答案: