Javascript jQuery更新函数，其中包含来自JS的输入更改

我有一些功能和事件，可以在更改、粘贴、键控和touchend时更新发票总额，效果非常好。不过，我已经编写了一些代码，允许您从下拉选择中插入项目数据，并将一些内容复制到输入值，但是这些内容不会更新，现在可以确定需要进行哪些更改才能实现这一点。有人有什么想法吗

JSFiddle：（如果您单击selectproduct并添加您的产品，请明白我的意思，它会添加名称和值，但我需要它来更新小计以及底部的总计，就像您手动为项目输入值时一样）

JS:

• id

  问题在于它必须是唯一的，这不会解决问题，但会阻止其他问题，这是一条HTML规则（）：

id属性为HTML元素指定唯一的id（值） 在HTML文档中必须是唯一的）

id属性最常用于指向样式表中的样式，并由JavaScript（通过htmldom）操作具有特定id的元素

• input

  事件应包含您单独列出的所有其他事件，但有些不同（）：

在通过用户更改元素的文本内容时发生 接口

• 这是另一个问题：

  e.preventDefault，您错过了括号：
  e.preventDefault（）

• 真正的问题是

  updateTotals（）

  发送了错误的元素标识符，这是正确的：

  updateTotals（'.calculate'）
  
  

---

我正在检查，但是我注意到，每次添加新项目时，都会使用相同的

id=“invoice\u product”

创建一个

输入，这是不好的。啊，我这样做了，我会更新它，改为使用类，我确实在列表中添加了输入，但什么也没做，只是让我尝试一下。所以我更新了你的建议，似乎仍然不起作用：完美的谢谢，伙计，我知道这是一件更简单的事情。谢谢你！
$(document).on('click', ".item-select", function(e) {

        e.preventDefault;

        var product = $(this);

        $('#insert').modal({ backdrop: 'static', keyboard: false }).one('click', '#selected', function(e) {

            var itemText = $('#insert').find("option:selected").text();
            var itemValue = $('#insert').find("option:selected").val();

            $(product).closest('tr').find('#invoice_product').val(itemText);
            $(product).closest('tr').find('#invoice_product_price').val(itemValue);

            //updateTotals('#invoice_table');
            //calculateTotal();

        });

        return false;

    });

// add new product row on invoice
    var cloned = $('#invoice_table tr:last').clone();
    $(".add-row").click(function(e) {
        e.preventDefault();
        cloned.clone().appendTo('#invoice_table'); 
    });

    calculateTotal();

    $('#invoice_table').on('change keyup paste touchend', '.calculate', function() {
        updateTotals(this);
        calculateTotal();
    });

    $('#invoice_totals').on('change keyup paste touchend', '.calculate', function() {
        calculateTotal();
    });

    function updateTotals(elem) {

        var tr = $(elem).closest('tr'),
            quantity = $('[name="invoice_product_qty[]"]', tr).val(),
            price = $('[name="invoice_product_price[]"]', tr).val(),
            isPercent = $('[name="invoice_product_discount[]"]', tr).val().indexOf('%') > -1,
            percent = $.trim($('[name="invoice_product_discount[]"]', tr).val().replace('%', '')),
            subtotal = parseInt(quantity) * parseFloat(price);

        if(percent && $.isNumeric(percent) && percent !== 0) {
            if(isPercent){
                subtotal = subtotal - ((parseFloat(percent) / 100) * subtotal);
            } else {
                subtotal = subtotal - parseFloat(percent);
            }
        } else {
            $('[name="invoice_product_discount[]"]', tr).val('');
        }

        $('.calculate-sub', tr).val(subtotal.toFixed(2));
    }

    function calculateTotal() {

        var grandTotal = 0,
            disc = 0,
            c_ship = parseInt($('.calculate.shipping').val()) || 0;

        $('#invoice_table tbody tr').each(function() {
            var c_sbt = $('.calculate-sub', this).val(),
                quantity = $('[name="invoice_product_qty[]"]', this).val(),
                price = $('[name="invoice_product_price[]"]', this).val() || 0,
                subtotal = parseInt(quantity) * parseFloat(price);

            grandTotal += parseFloat(c_sbt);
            disc += subtotal - parseFloat(c_sbt);
        });

        // VAT, DISCOUNT, SHIPPING, TOTAL, SUBTOTAL:
        var subT = parseFloat(grandTotal),
            finalTotal = parseFloat(grandTotal + c_ship),
            vat = parseInt($('.invoice-vat').attr('data-vat-rate'));

        $('.invoice-sub-total').text(subT.toFixed(2));
        $('#invoice_subtotal').val(subT.toFixed(2));
        $('.invoice-discount').text(disc.toFixed(2));
        $('#invoice_discount').val(disc.toFixed(2));

        if($('.invoice-vat').attr('data-enable-vat') === '1') {

            if($('.invoice-vat').attr('data-vat-method') === '1') {
                $('.invoice-vat').text(((vat / 100) * subT).toFixed(2));
                $('#invoice_vat').val(((vat / 100) * subT).toFixed(2));
                $('.invoice-total').text((finalTotal).toFixed(2));
                $('#invoice_total').val((finalTotal).toFixed(2));
            } else {
                $('.invoice-vat').text(((vat / 100) * subT).toFixed(2));
                $('#invoice_vat').val(((vat / 100) * subT).toFixed(2));
                $('.invoice-total').text((finalTotal + ((vat / 100) * finalTotal)).toFixed(2));
                $('#invoice_total').val((finalTotal + ((vat / 100) * finalTotal)).toFixed(2));
            }
        } else {
            $('.invoice-total').text((finalTotal).toFixed(2));
            $('#invoice_total').val((finalTotal).toFixed(2));
        }

    }

$(document).on('click', ".item-select", function (e) {
    e.preventDefault();
    var product = $(this);

    $('#insert').modal({backdrop: 'static',keyboard: false}).one('click', '#selected', function (e) {
        var itemText = $('#insert').find("option:selected").text();
        var itemValue = $('#insert').find("option:selected").val();

        $(product).closest('tr').find('#invoice_product').val(itemText);
        $(product).closest('tr').find('#invoice_product_price').val(itemValue);

         updateTotals('.calculate');
        calculateTotal();

    });

    return false;

});