javascript - 具有多个选择元素的 jQuery 价格计算器

Question

当选择按钮和选择菜单时，我使用以下代码从范围(报价-价格)中添加/删除价格。以下代码非常适合按钮以及当我仅使用一个选择菜单时，但是当我使用多个选择菜单时，它会失败。有谁知道如何调整以下代码以使用多个选择菜单？

$(document).ready(function() {

    function updateTotal() {
        var total = 0;
        $('button.selected').each(function() {
            total += parseFloat($(this).val());
        });
        total += parseFloat($('select').val());
        $('span.quote-price').text("£" + total.toFixed(2));
    }

    $('button').click(function() {
        $(this).toggleClass('selected');
        updateTotal();
    });
    $('select').change(updateTotal);

    $('.reset').click(function() {
        $('.selected').removeClass('selected');
        $('select').val('0.00');
        updateTotal();
    });
});

Answer 1

您可以模仿已有的按钮代码。而不是这个:

total += parseFloat($('select').val());

..使用这个:

$('select').each(function() {
    total += parseFloat($(this).val());
});

这会将页面上每个选择的值添加到变量total中。如果您只需要一些选择(您的页面上可能出于其他原因而需要它们)，请向它们添加一个类(例如 price)，并将选择器更改为 select.price .