JQuery множественный выбор прайс-лист с суммированием

Question

Я готовлю сайт для моей сестры, где вы можете выбрать из списка некоторые элементы, и они будут отображаться под списком - для этого я использую скрипт asmselect. На данный момент у меня все работает идеально, и, поскольку я полностью новичок, когда дело доходит до jquery, я не изменяю ни один из исходных кодов. Но проблема в том, что моя сестра хотела бы, чтобы каждому пункту списка была назначена цена, и она хотела бы, чтобы выбранные цены суммировались в списке. Так что она хотела бы добиться чего-то похожего, например, на то, что весь дизайн должен выглядеть как ассемблер - должен быть только один список. Я попытался реализовать исходные значения кода для каждого параметра списка, а затем использовать стандартный суммирующий код jquery (что-то вроде этого), а затем код, о котором я писал

$(function () {
var fields = $('#form1 :input').change(calculate);
function calculate() {
    var price = 0;
    fields.each(function () {
        price += +$(this).val();
    })
    $('#price').html(price.toFixed(2));
}
})

но это не работает - вероятно, потому что, честно говоря, я не знаю, что я делаю. Как я уже писал, я полностью новичок в этом, и каждая подсказка или идея, как это сделать, будет принята с благодарностью! Я пытался самостоятельно изменить исходные коды (я знаю, что не должен этого делать) в течение нескольких дней и до сих пор не знаю, что делать дальше, и у меня нет никого, кто бы об этом спросил.

Answer 1

В вашем коде вы пытаетесь перебрать событие, которое вы связали с элементом. Измените его на список элементов ввода.

$(function() {
    var fields = $('#form1 :input');
    fields.change(function() {
        var price = 0;
        fields.each(function() {
            price += parseFloat($(this).val());
        });
        $('#price').html(price.toFixed(2));
    });
})