Как суммировать все числа в таблицу с помощью JavaScript

Question

Я работаю на несколько стола, где вы можете добавить этот ввод номер

У меня есть окно падения, где я могу выбрать, сколько таблицы будет я отображать от 1 до 10

Choose How many table 
1 
2 
3 
4 
5 
6 
7 
8 
9 
10 

если я выбираю 2 есть 2 таблицы, которая будет appeear

Image for Sample Table

Пожалуйста, смотрите картинку выше

Как вы можете видеть на картинке, есть дополнительная величина, но во 2-й таблице нет, потому что она не суммировала числа во 2-й таблице.

Вот мой HTML код Количество

<td style="text-align:center;"> 

<input type="text" name="<?php echo $ID?>" id="_aaa" pattern="^[0-9]+$" style="background:transparent; text-align:center; width:50px;" required> 

</td> 

Html для Sub Количество

<table class="table table-bordered" id="table3" align='right' style="margin-top:15px; width:30%;" > 

      <tr> 
       <th style='border: 1px solid;'>Sub Quantity </th> 
       <td style='border: 1px solid; width: 150px; text-align:center;'><span id="_aaa_Sub"> </span></td> 
      </tr> 


</table> 

Html для Общее количество

<table class="table table-bordered" id="table3" align='right' style="margin-top:15px; width:30%;" > 

      <tr> 
       <th style='border: 1px solid;'>Total Quantity </th> 
       <td style='border: 1px solid; width: 150px; text-align:center;'><span id="_aaa_Final"> </span></td> 
      </tr> 


</table> 

и вот мой Javascript

<script language="javascript"> 

    $(function() { 
     //var inputs = $("input"); 
     var inputs = $("[id=_aaa]"); 


     inputs.blur(function() { 
      var total = 0; 
      $.each(inputs, function (input) { 
       var num = parseInt(inputs[input].value); 
       total += (!isNaN(num)) ? num : 0; 
      }); 

      document.getElementById("_aaa_Sub").innerHTML = total; 

     }) 
    }) 


</script>  


<script language="javascript"> 

    $(function() { 

     var inputs = $("[id=_aaa]"); 


     inputs.blur(function() { 
      var total = 0; 
      $.each(inputs, function (input) { 
       var num = parseInt(inputs[input].value); 
       total += (!isNaN(num)) ? num : 0; 
      }); 

      document.getElementById("_aaa_Final").innerHTML = total; 

     }) 
    }) 

</script> 

Можете ли вы помочь мне с моим вопросом? Заранее спасибо!

Answer 1

Это потому, что ваша первая функция JS будет вызываться только для одной таблицы, как это не в each цикле .. Так что попробуйте добавить всю функцию внутри each

И не используйте ID, как они должны быть уникальными попробовать с использованием class для подкатегории

$(function() { 

    var table = $('table');//or any identifier for your table 
    $.each(table,function(i) { 
    var inputs = $("[id=_aaa]"); 
    var self = this; 

    inputs.blur(function() { 
     var total = 0; 
     $.each(inputs, function (input) { 
      var num = parseInt(inputs[input].value); 
      total += (!isNaN(num)) ? num : 0; 
     }); 
     $(self).closest("#_aaa_Sub").innerHTML = total; 
    }) 
}) 
})