Блог

У меня есть функция, которая генерирует текстовые поля из цикла for

 var txtBox = "<input type='text' id='txtNum[]' />"
for(var i = 0; i<=names.length;i  )//retrieve names from the array
    {
        html  = "<tr id='row"   i  "'><td style='border:1px solid black;'>" names[i] "</td>";
        for(var j=1;j<=2;j  )//amount of textboxes need to be created
        {
            html = "<td style='border:1px solid black;'>" txtBox "</td>";
        }
        for(var k=1;k<=1;k  )//amount of textboxes need to be created
        {
            html = "<td style='border:1px solid black;'>" txtBox "</td>";
        }
        html  = "</tr>";        
    }
  

этот цикл for сгенерирует 3 текстовых поля подряд с одинаковым идентификатором, если длина имен не будет соблюдена, но моя проблема в том, что я хочу вычислить, скажем, сложение тех значений, которые будут введены в текстовые поля, но не удается найти способ сделать это. Я искал в Интернете примеры, но почти все они показывают текстовые поля с другим вычисляемым идентификатором, ни один из которых я не видел с идентификатором в виде массива.

Я ограничен только javascript и html.

Есть идеи о том, как этого можно достичь??
Заранее спасибо..

Первый. Идентификаторы — это идентификаторы. Не может быть другого пользователя с таким же идентификатором, как у вас, поэтому не должно быть двух элементов с одинаковыми идентификаторами. Вместо этого используйте class. Классы HTML

Для вашей проблемы. Когда вы измените его на class, вы можете использовать

 let arr = document.querySelectorAll(".CLASS_NAME")
  

.querySelectorAll

или

 let arr = document.getElementsByClassName('CLASS_NAME')
  

.getElementsByClassName

чтобы получить массив всех полей ввода, а затем просто

 arr.ForEach((e)=>{
/*FUNCTION BODY HERE. HERE WILL BE ADDITION*/
let valueOfOneOfThem = parseInt(e.value) || 0;
sumOfAll  = valueOfOneOfThem;
});
  

.ForEach

Рабочая скрипка