javascript - 使用 jQuery 添加点击数字

Question

嗯，我正在尝试制作一种发票。 这是我的问题:发票有各种输入框，其中金额由用户输入，并且这些框列表的末尾有“总费用”(输入框)。所以我想要的是，如果在输入框中填写一些值(数字)并且用户单击“总费用”(输入框)，则这些值将被求和。我该怎么做？我以前用过jQuery。那么，如果可能的话，谁能解释一下我该如何在 jQuery 中做到这一点？

到目前为止的脚本

$('.charge').blur(function () {
var totalocharges = 0;
$('.charge').each(function() {
    totalocharges += Number($(this).val());
});


$('#total_charges').val(totalocharges);
});

我的看法(仅部分):

<div class="form-group  col-md-offset-1 col-md-5">          
    <input type="number" class="charge form-control" id="amount1" name="amount1" value="<?php echo set_value('amount1'); ?>" placeholder="amount" required>
  </div>

<div class="form-group  col-md-offset-1 col-md-5">          
    <input type="number" class="charge form-control" id="amount2" name="amount2" value="<?php echo set_value('amount2'); ?>" placeholder="amount" required>
  </div>

<div class="form-group  col-md-offset-1 col-md-5">          
    <input type="text" class="form-control" id="total_charges" name="total_charges" value="<?php echo set_value('total_charges'); ?>" placeholder="net amount">
  </div>

Answer 1

你可以用 jQuery 做类似的事情。

在此示例中，您的输入框将具有“charge”类别。并且您的总费用输入ID总费用)

$('.charge').blur(function () {
    var total_charges = 0;
    $('.charge').each(function() {
        total_charges += Number($(this).val());
    });


    $('#total-charges').val(total_charges);
});​​​​​​​​

这里有一个工作代码示例:

https://jsfiddle.net/0e8emcbu/

如果你想用按钮激活它，那就像这样:

https://jsfiddle.net/8cmL29xt/