简体   繁体   English

getelementsbyname返回未定义的值

[英]getelementsbyname Return Undefined value

I'm a javascript newbie and I have try this. 我是javascript新手,我已经尝试过了。

 <html> <style> #WoodNumInput { width:40px; } </style> <body> <script> var i; var woodtypeAB = ["AB_W15_L100","AB_W20_L100", "AB_W25_L100", "AB_W30_L100"]; for (i = 0; i < 4 ; i++) { document.write("<div id = 'box'><input type ='number' name = '" + woodtypeAB[i] + "' id = 'WoodNumInput' value = " + i + "></div><br/>"); } </script> <br/> <input type = "button" value = "calculate" onclick= "Calculation()"> <div id = "Test"></div> <script> function Calculation() { var ShowResult = document.getElementsByName("woodtypeAB[3]").value; document.getElementById("Test").innerHTML = ShowResult; } </script> </body> 

The value returns undefined and I still can't figure it out. 该值返回未定义,我仍然无法弄清楚。

Thank in advance for your help and suggestions. 在此先感谢您的帮助和建议。

This 这个

var ShowResult = document.getElementsByName("woodtypeAB[3]").value

should be 应该

var ShowResult = document.getElementsByName(woodtypeAB[3])[0].value

Since "woodtypeAB[3]" is surrounded by quotation marks it will be interpreted as a string rather than the actual array value. 由于"woodtypeAB[3]"用引号引起来,因此它将被解释为字符串,而不是实际的数组值。

document.getElementsByName() returns a NodeList of elements so you will have to explicitly say that you want the first item in the NodeList, hence [0] document.getElementsByName()返回元素的NodeList,因此您必须明确地说您要NodeList中的第一项,因此[0]

There are a few things wrong. 有一些错误。

First, you're trying to get the .value from a collection instead of from individual elements. 首先,您尝试从集合而不是单个元素中获取.value

Also, the elements you're creating have a name value of AB_... but you're trying to fetch using a very different name. 同样,您正在创建的元素的名称值为AB_...但是您试图使用一个非常不同的名称来获取。

I think you perhaps thought that the woodtypeAB[3] you're fetching would somehow translate to the variable and index you used to create the element's name. 我想您可能以为您正在获取的woodtypeAB[3]会以某种方式转换为用于创建元素名称的变量和索引。 That's not how it works. 那不是它的工作原理。

When you created the element, the concatenation did not add woodtypeAB[3] as the name, but rather the value located at that index of that array. 创建元素时,串联时并没有添加woodtypeAB[3]作为名称,而是添加了位于该数组索引处的 So to fetch that particular name, you'd use its array value of AB_W30_L100 . 因此,要获取该特定名称,可以使用其数组值AB_W30_L100

 <html> <style> #WoodNumInput { width: 40px; } </style> <body> <input type="button" value="calculate" onclick="Calculation()"> <div id="Test"></div> <br> <script> var i; var woodtypeAB = ["AB_W15_L100", "AB_W20_L100", "AB_W25_L100", "AB_W30_L100"]; for (i = 0; i < 4; i++) { document.write("<div id = 'box'><input type ='number' name = '" + woodtypeAB[i] + "' id = 'WoodNumInput' value = " + i + "></div><br/>"); } </script> <br/> <script> function Calculation() { var ShowResult = document.getElementsByName("AB_W30_L100"); if (ShowResult.length != 0) { document.getElementById("Test").innerHTML = ShowResult[0].value; } } </script> </body> 

Although something tells me that you actually are going to want to select all those input elements and perform some calculation on them. 尽管有些事情告诉我您实际上将要选择所有这些输入元素并对其进行一些计算。 That'll require additional tweaks to your code. 这将需要对代码进行其他调整。

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

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