Всем привет!
Есть динамическая таблица, в которую можно добавить сколько угодно полей и посчитать сумму каждого из полей. Я новичок в javascript, поэтому опыта конечно не хватает, мои мысли как решить эту задачу склоняются в сторону цикла, или как то записать сумму каждой итерации в массив и после уже вывести сумму каждой пары чисел.
Задача такая, посчитать сумму Число[1] + Число[2], для всех возможных input полей, т.е. если будет добавлено 10 динамических полей, в ответе должно получится 10 полей с суммами.
Буду очень благодарен если, подскажите в каком направлении действовать, чтоб решить эту задачу.
var d = document;
var last_id = 0;
function add_value_f() {
// находим нужную таблицу
var tbody = d.getElementById('table').getElementsByTagName('tbody')[0];
// создаем строку таблицы и добавляем ее
var row = d.createElement("tr");
tbody.appendChild(row);
// создаем ячейки в вышесозданной строке
var td1 = d.createElement("td");
var td2 = d.createElement("td");
row.appendChild(td1);
row.appendChild(td2);
last_id = last_id + 1;
// добавляем формы ввода в ячейки
td1.innerHTML = '<input type="number" min="0" id="chislo[' + last_id + ']" class="data">';
td2.innerHTML = '<input type="number" min="0" id="chislo2[' + last_id + ']" class="data">';
};
function totalSum() {
var num1 = document.getElementById('chislo[' + last_id + ']').value;
var num1p = parseInt(num1);
if (isNaN(num1p)) {
num1p = 0;
}
var num2 = document.getElementById('chislo2[' + last_id + ']').value;
var num2p = parseInt(num2);
if (isNaN(num2p)) {
num2p = 0;
}
var sum;
sum = num1p + num2p;
out.innerHTML = " " + sum + "<br>";
}
<div class="stats-tab">
<h1> Таблица</h1>
<table id="table">
<thead>
<tr>
<th class="data">Число 1</th>
<th class="data">Число 2</th>
</tr>
</thead>
<tbody>
<tr>
<td><input type="number" id="chislo[0]" min="0" class="data"></td>
<td><input type="number" id="chislo2[0]" min="0" class="data"></td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="col-12">
<input type="button" onclick="add_value_f()" value="Добавить" />
</div>
</div>
<button onclick="totalSum()">=</button>
<hr>
<h1>Результаты:</h1>
<div id="out"></div>