j查询基于复选框更新当前价格

jQuery update current price based on checkbox

本文关键字：更新 复选框 查询      更新时间：2023-09-26

当客户检查其他选项时，我尝试更新当前字段值。

我有几个复选框，输入具有不同值的字段。

 <input type="checkbox" class="item-price-checkbox" name="equipment_1" value="20">
 <input type="checkbox" class="item-price-checkbox" name="equipment_2" value="30">
 <input type="checkbox" class="item-price-checkbox" name="equipment-3" value="50">

目前汽车价格为100美元。当客户检查equipment_1时，它会将其价格添加到现有价格中。所以在这种情况下，它将是 100$ + 20$ = 120$ . 我的脚本无法正常工作。因为当我检查某些东西时，我没有得到120我得到10020.所以加法不能正常工作。

var basePrice = $(".price_field").val();
$(".item-price-checkbox").change(function() {
    var newPrice = basePrice;
    $('.item-price-checkbox:checked').each(function() {
        newPrice += $(this).val();
        // newPrice = newPrice + $(this).val();
    });
    $('.price_field').val(newPrice);
});

尝试将接收到的值转换为number，

var basePrice = parseInt($(".price_field").val(),10);
$(".item-price-checkbox").change(function() {
    var newPrice = basePrice;
    $('.item-price-checkbox:checked').each(function() {
        newPrice += parseInt($(this).val(),10);
    });
    $('.price_field').val(newPrice);
});

基本上，.val()将以字符串的形式返回类型化的值。 我们必须手动将其转换为数字。另外，不要忘记在解析string时传递radix参数number。如果您不这样做，则转换将根据提供的字符串以不同的方式进行。

相关文章：