Question

我正在尝试使用数组进行简单的计算，但它没有触发。如果我将其更改为span或div，它可以正常工作。为什么不使用输入字段？

我需要它作为输入字段，因为它更容易将值存储在数据库中。

    <input type="text" class="input-small" name="partnumber[]">
    <input type="text" class="input-small" name="partdescription[]" >
    <input type="text" class="input-small" name="partprice[]" onblur="doCalc(); calculate(); ">
    <input type="text" class="input-small" name="partquantity[]" onblur="doCalc(); calculate(); ">
    <input type="text" readonly class="input-small parttotal" name="parttotal[]" >

计算

function doCalc() {
    var total = 0;

    $('tr').each(function() {
        $(this).find('.parttotal').html($('input:eq(2)', this).val() * $('input:eq(3)', this).val());
    });
    $('.parttotal').each(function() {
        total += parseInt($(this).text(),10);
    });
}

Answer 1

首先，我不会使用内联事件..这里我使用了委托事件，如果你动态添加更多行，这里有一个优势，它仍然可以工作..

接下来确保每一行都有每行的包装，这里我使用了一个简单的DIV。 Yousr可能是你的TR ..

其余部分变得简单，这里可以看到，这个例子我只是包括了价格，数量和数量。总计，完成2行测试..

function calc() {
  var h = $(this).closest('div');
  var qty = h.find('[name="partquantity[]"]');
  var price = h.find('[name="partprice[]"]');
  var total = h.find('[name="parttotal[]"]');
  total.val(qty.val() * price.val());
}

$('body').on('blur', '[name="partprice[]"],[name="partquantity[]"]', calc);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div>
  <input type="text" class="input-small" name="partprice[]">
  <input type="text" class="input-small" name="partquantity[]">
  <input type="text" readonly class="input-small parttotal" name="parttotal[]" >
</div>

<div>
  <input type="text" class="input-small" name="partprice[]">
  <input type="text" class="input-small" name="partquantity[]">
  <input type="text" readonly class="input-small parttotal" name="parttotal[]" >
</div>

Answer 2

您无法使用.html()设置文本框的值。

更改此行：

$(this).find('.parttotal').html($('input:eq(2)', this).val() * $('input:eq(3)', this).val());

到

$(this).find('.parttotal').val($('input:eq(2)', this).val() * $('input:eq(3)', this).val());

请注意，更改('.parttotal').html变为('.parttotal').val

使用输入字段而不是span或div

2 个答案: