добавить входы с помощью jquery

У меня есть форма в html, и мне нужно добавить входы при добавлении значения к ним (потерять фокус), я пробовал такой класс

introducir la descripción de la imagen aquí

function calcular_total() {

    var importe_total = 0
    $('.amt').keyup(function (){
        $(".amt").each(
            function(index, value) {
                importe_total = importe_total + eval($(this).val());
                console.log(importe_total);
            }
        );  
    });
    $("#inputTotal").val(importe_total);
} 

функция вызывается в готовом документе

$(document).ready(function(){

    calcular_total();

});

html

Costos Servicios Costo Logistica
Costo Infraestructura Costo Contingencia
Costo Licencias Otros Costos

0
задан 09.12.2016, 19:49
2 ответа

Какие-то важные темы:

  • $("#inputTotal").val(importe_total); был вне ее funciГіn keyup равно как importe_total
  • неудар в лунку у них должна быть стандартная настройка нуля (чтобы предотвращать ошибки).
  • должен себе санкционировать, что они dГ-gitos принятые в доме они были nГєmeros (проверять nГєmeros стоившие ).

$('.amt').keyup(function() {
var importe_total = 0
  $(".amt").each(
    function(index, value) {
      if ( $.isNumeric( $(this).val() ) ){
      importe_total = importe_total + eval($(this).val());
      //console.log(importe_total);
      }
    }
  );
      $("#inputTotal").val(importe_total);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<table>
  <tr>
    <td style="width:25%;">Costos Servicios</td>
    <td style="width:25%;">
      <input type="text" id="inputCostosServicios" class="solo-numero amt" style="width:70% !important; text-align:right" value="0" />
    </td>
    <td style="width:25%;">Costo Logistica</td>
    <td style="width:25%;">
      <input type="text" id="inputCostoLogistica" class="solo-numero amt" style="width:70% !important; text-align:right" value="0" />
    </td>
  </tr>
  <tr>
    <td style="width:25%;">Costo Infraestructura</td>
    <td style="width:25%;">
      <input type="text" id="inputCostoInfraestructura" class="solo-numero amt" style="width:70% !important; text-align:right" value="0" />
    </td>
    <td style="width:25%;">Costo Contingencia</td>
    <td style="width:25%;">
      <input type="text" id="inputCostoContingencia" class="solo-numero amt" style="width:70% !important; text-align:right" value="0" />
    </td>
  </tr>
  <tr>
    <td style="width:25%;">Costo Licencias</td>
    <td style="width:25%;">
      <input type="text" id="inputCostoLicencias" class="solo-numero amt" style="width:70% !important; text-align:right" value="0" />
    </td>
    <td style="width:25%;">Otros Costos</td>
    <td style="width:25%;">
      <input type="text" id="inputOtrosCostos1" style="width:70% !important; text-align:right" value="0" />
    </td>
  </tr>
  <tr>
    <td colspan="4">
      <div style="text-align:right; margin-right:7%;">
        <label style="margin-right:8px;">Total</label>
        <input type="text" id="inputTotal" class="solo-numero" style="width:18% !important; margin-right:-2px; text-align:right" />
      </div>
    </td>

  </tr>
</table>
2
ответ дан 24.11.2019, 12:12

Ну, ты звонишь в функцию calcular_total(), которая внутри использует функцию пульса .keyup() следовательно, никогда оно не будет функционировать.

ты Можешь тестировать с этим onChange() обнаружь любое изменение в твоем неударе в лунку, когда пользователь продолжит писать немедленно, будут видны изменения в полном неударе в лунку.:

function suma() {
      var add = 0;
      $('.cl').each(function() {
          if (!isNaN($(this).val())) {
              add += Number($(this).val());
          }
      });
      $('#sumAll').val(add);
  };
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
  Costos Servicios : <input id="Text1" class="cl" type="text" onChange="suma();" />
  <br />
  Costo Infraestructura : <input id="Text2" class="cl" type="text" onChange="suma();" />
  <br />
  Costo Licencias : <input id="Text3" class="cl" type="text" onChange="suma();" />
  <br />
  Total : <input id="sumAll" type="text" value="" />
  <br />

Другой выбор, который также выполняет то же функционирование, состоит в том, чтобы ты оставил твой такой код как эта, кроме того, что событие keyup не будет внутри функции а, что был внутри document.ready

Совет:

Уберегись importe_total = importe_total + eval($(this).val()); из-за importe_total+= eval($(this).val());

2
ответ дан 24.11.2019, 12:12

Теги

Похожие вопросы