使用 JavaScript 将值放入动态生成的输入类型中

Question

我有 Range/Number 类型的同步输入，并动态生成与其值一样多的输入字段。

然后我有一个按钮，可以用任意值填充生成的输入字段。

每个动态生成的输入字段都有唯一的 ID，但 document.getElementById() 函数无法找到任何 ID，并且 returns 为空。

有没有办法更改 randomizeItemTypes() 函数中生成的字段的值？

function randomizeItemTypes(textbox) {
  var rackNum = textbox.replace("itemSlider", "").replace("numOfTypes", "");
  var numOfTypes = document.getElementById("numOfTypes1").value;
  for (var i = 0; i < numOfTypes; i++) {
    document.getElementById("rack" + rackNum + "." + i).value = 4;
  }
}

下面link是我代码的CodePen： http://codepen.io/cnc4ever/pen/LGNMEp

谢谢大家！

Answer 1

你的 rackNum 给出了一些字符串而不是数字您的文本框 ID 类似于 rack1.0 , rack1.1 使用 document.getElementById("rack1" + "." + i).value = 4; 代替

Answer 2

 <html>
  <head>
    <title></title>
  </head>
   <body>
 <div class="itemsTypes1">
    <input id="itemSlider1" type="range" value="" min="1" max="10" step="1" onchange="printValue(this.value);drawItemTypes('itemSlider1');" />

     <input id="numOfTypes1" type="number" value="" min="1" max="10" onchange="printValue(this.value);drawItemTypes('numOfTypes1');" />
    <p id="itemTypes1Area"></p>
  <button id="randomize1" onclick="randomizeItemTypes()">Randomize</button>
</div>
<script type="text/javascript">
         function printValue(data) {

              var x = document.getElementById("itemSlider1").value = data;
              var y = document.getElementById("numOfTypes1").value = data;

            }
         function randomizeItemTypes() {
              var randomValue= Math.ceil(Math.random()*10);
              printValue(randomValue);
            }
      </script>
   </body>
 </html>

使用 JavaScript 将值放入动态生成的输入类型中

Putting values into dynamically generated input types with JavaScript

html

javascript

getelementbyid