如何通过 ID 将我的输入值传递给 javascript

Question

所以这是我在 HTML 中的代码：

<div><label> Control Number </label>
  <input name="get_control_num" style="text-transform:uppercase"
    class="form-control" id="sel_control_num" readonly>
</div>
<div class="form-group">
  <label> Quantity </label>
  <input class="form-control" name="quantity" type="number"
    onchange="addInputs(this)" />
  <br>
  <button type="button" class="btn btn-primary"> Add Control Number </button>
</div>
<div class="form-group" id="parent"></div>

这是我在 Javascript 中使用 setAttribute 的代码

function addInputs(pass) {
  var n = pass.value && parseInt(pass.value, 10);
  if (isNaN(n)) {
    return;
  }
  var input;
  var getCurrdata = document.getElementById("sel_control_num");
  var parent = document.getElementById("parent");
  functionPopulate(parent);
  for (var i = 0; i < n; i++) {
    input = document.createElement('input');
    input.setAttribute('placeholder', 'Control No.')
    input.setAttribute('type', 'text');
    input.setAttribute('class', 'onInput');
    input.setAttribute('name', 'get_Input_show');
    input.setAttribute('value', '*suppose to be value of ID #select_control_num*');
    document.getElementById("parent").style.padding = "5px 0px 0px 0px";
    parent.appendChild(input);
  }
}

function functionPopulate(div) {
  div.innerHTML = '';
}

如何在我的 HTML 中传递ID(#sel_control_num)内的值，以便如果我根据我放的数量添加，它应该显示该 ID 的数据。 我想不出合适的解决方案，因为我是 javascript 的新手。 谢谢您的帮助。

Answer 1

input.setAttribute('value', document.getElementById('sel_control_num').value);

请注意，您发布的 HTML 中的<input>的 ID 为sel_control_num而不是select_control_num作为您在问题中所写的。

Answer 2

你可以这样做：

input.setAttribute('value', document.getElementById('select_control_num').value);

https://developer.mozilla.org/en-US/docs/Web/API/Document/getElementById

另一种解决方案是

input.setAttribute('value', document.querySelector('#select_control_num').value);

https://developer.mozilla.org/en-US/docs/Web/API/Document/querySelector

另请注意，您要求从 ID select_control_num的元素中获取值，但我只在 html 中看到 ID sel_control_num的元素，因此请确保它们匹配。