Доступ к элементам формы с помощью JavaScript

Question

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

вот образец

<input name="mobiles[]" id="mobile"><a onclick="addfield()">add</a>

я использую метод appenchild для добавления новых входов

для доступа к мобильным элементам я использую

document.getElementsByName('mobiles[]').length;

но он возвращает только 1 и не считает добавленные поля

Answer 1

Я думаю, что вы добавляете поля ввода неправильно. Проверьте фрагмент ниже и попробуйте запустить его. Надеюсь это поможет.

addField = function(){
  var wrapper = document.getElementById('wrapper');
  var li = document.createElement('li');
  
  var input = document.createElement('input');
  input.name = 'mobiles[]';
  
  li.append(input);
  wrapper.append(li);
};

updateCount = function(){
  // Shows you current count on the page.
  count = document.getElementsByName('mobiles[]').length;
  document.getElementById('count-wrapper').innerHTML = count;
};

<ul id="wrapper">
  <li><input name="mobiles[]"></li>
</ul>

<button onclick="addField()">Add Input</button>
<button onclick="updateCount()">Update Count</button>

<div>
  Input Field Count is : <span id="count-wrapper">1</span>
</div>