javascript - 使用 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>