将输入值乘以其他输入答案

【问题标题】：Multiply input values into other input将输入值乘以其他输入
【发布时间】：2021-01-30 03:55:17
【问题描述】：

我想将数字相乘，结果显示在另一个输入中。

我设法用以下代码获得了每个输入的值，但是从这里我不知道如何前进并使其相乘，结果显示在“总计”的输入中。

这是代码的一部分：

$(`
        [name='unidadTrabajosFactura'], 
        [name='precioUniTrabajoFactura'],
        [name='totalTrabajoFactura']
        `).each(
            function(index, item){
                
            var valores = $(item).val();
            console.log(valores)

        });

在控制台中我得到以下结果：

我想要实现的是数量值乘以单价并在总输入中显示结果

这是我的表单代码

 <div class="job-form row mb-3">

<div class="col-md-1">
    <label for="unidadTrabajosFactura" class="">Unidad</label>
    <input type="text" name="unidadTrabajosFactura" class="form-control" value="{{trabajo.unidad}}">
</div>
<div class="col-md-5">
    <label for="descTrabajosFactura" class="">Descripción</label>
    <input type="text" name="descTrabajosFactura" maxlength="200" class="form-control" value="{{trabajo.trabajo}}">
</div>
<div class="col-md-2">
    <label for="precioUniTrabajoFactura" class="">Precio Unitario</label>
    <input type="text" name="precioUniTrabajoFactura" class="form-control" value="{{trabajo.precio_unitario}}">

</div>
<div class="col-md-2">
    <label for="totalTrabajoFactura" class="">Total</label>
    <input type="text" name="totalTrabajoFactura" class="form-control" value="{{trabajo.total}}">
</div>

这些字段可以是多个也可以是一个

问候

【问题讨论】：

标签： javascript python jquery django

【解决方案1】：

您可以循环遍历 job-form div 并在每个循环内使用 .find() 来获取所需的输入值并在总输入中添加总计。

演示代码：

//loop through form divs
$(".job-form").each(function(index, item) {
  //get values..
  var units = parseInt($(this).find("[name=unidadTrabajosFactura]").val());
  var price = parseInt($(this).find("[name=precioUniTrabajoFactura]").val());
  //add total to required input
  $(this).find("[name=totalTrabajoFactura]").val(units * price)
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="job-form row mb-3">
  <div class="col-md-1">
    <label for="unidadTrabajosFactura" class="">Unidad</label>
    <input type="text" name="unidadTrabajosFactura" class="form-control" value="10">
  </div>
  <div class="col-md-5">
    <label for="descTrabajosFactura" class="">Descripción</label>
    <input type="text" name="descTrabajosFactura" maxlength="200" class="form-control" value="Something...">
  </div>
  <div class="col-md-2">
    <label for="precioUniTrabajoFactura" class="">Precio Unitario</label>
    <input type="text" name="precioUniTrabajoFactura" class="form-control" value="2">

  </div>
  <div class="col-md-2">
    <label for="totalTrabajoFactura" class="">Total</label>
    <input type="text" name="totalTrabajoFactura" class="form-control" value="{{trabajo.total}}">
  </div>
</div>
<div class="job-form row mb-3">
  <div class="col-md-1">
    <label for="unidadTrabajosFactura" class="">Unidad</label>
    <input type="text" name="unidadTrabajosFactura" class="form-control" value="10">
  </div>
  <div class="col-md-5">
    <label for="descTrabajosFactura" class="">Descripción</label>
    <input type="text" name="descTrabajosFactura" maxlength="200" class="form-control" value="Something..">
  </div>
  <div class="col-md-2">
    <label for="precioUniTrabajoFactura" class="">Precio Unitario</label>
    <input type="text" name="precioUniTrabajoFactura" class="form-control" value="3">

  </div>
  <div class="col-md-2">
    <label for="totalTrabajoFactura" class="">Total</label>
    <input type="text" name="totalTrabajoFactura" class="form-control" value="{{trabajo.total}}">
  </div>
</div>

【讨论】：