简体   繁体   English

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

[英]Putting values into dynamically generated input types with JavaScript

I have Range/Number type inputs that are synchronized and dynamically generate input fields as much as their values. 我有Range / Number类型的输入,它们被同步并动态生成输入字段和它们的值一样多。

Then I have a button that will fill the generated input fields with an arbitrary value. 然后我有一个按钮,用任意值填充生成的输入字段。

The dynamically generated input fields each have unique IDs, but the document.getElementById() function fails to find any of the IDs and returns null. 动态生成的输入字段每个都有唯一的ID,但document.getElementById()函数无法找到任何ID并返回null。

Is there a way to change the value of the generated fields within the randomizeItemTypes() function? 有没有办法在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;
  }
}

The following link is the CodePen to my code: http://codepen.io/cnc4ever/pen/LGNMEp 以下链接是CodePen到我的代码: http ://codepen.io/cnc4ever/pen/LGNMEp

Thanks guys! 多谢你们!

Your rackNum is giving some string instead of numbers Your id for textbox is something like rack1.0 , rack1.1 use document.getElementById("rack1" + "." + i).value = 4; 你的rackNum给出了一些字符串而不是数字你的文本框id就像rack1.0 , rack1.1使用document.getElementById("rack1" + "." + i).value = 4; instead 代替

 <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>

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM