Question

我在IE 10中遇到此问题。我在HTML页面的表单中包含此代码：

<input type='hidden' name='X123' />
<input type='hidden' name='123' />
<input type='hidden' name='00123' />

如果我运行这个JS命令：

document.forms['MyForm'].elements[name];

其中name是输入的名称，我只能得到第一个（'X123'）。在另外两种情况下，函数返回undefined。我在IE 10和Firefox上测试过它。在Firefox上工作。但是，它必须在IE下运行。这是一个MWE：

<html><head><script type='text/javascript'>
function println(text) {
    document.getElementById('output').innerHTML += '<p>' + text + '</p>';
}
function test() {
    println('X123 = '  + document.forms['MyForm'].elements['X123']);
    println('123 = '   + document.forms['MyForm'].elements['123']);
    println('00123 = ' + document.forms['MyForm'].elements['00123']);
}
</script></head><body onload='test();'><form name='MyForm'>
<input type='hidden' name='X123' />
<input type='hidden' name='123' />
<input type='hidden' name='00123' />
</form><div id='output'></div></body></html>

我需要知道这是否是IE的已知行为。

更好的解释：我在工作中遇到了这个问题。我制作了你看到的HTML只是为了复制问题（它不是教程）。我知道我可以使用jQuery或其他方法按名称获取元素，但我需要知道这是否是IE的已知行为，因为我无法在网上找到任何内容。

Answer 1

我需要知道这是否是IE的已知行为。

不仅仅是IE;对于123元素，that code也无法在Chrome或Firefox上运行。 Grundy似乎已找到the relevant info关于原因，即全数字名称会导致与基于索引的访问混淆，因此无法按名称提供。

...如果存在解决方法。

是的，您可以改用querySelector（适用于所有现代浏览器，也适用于IE8）。我没有IE10方便，但它适用于我的IE8，IE9，IE11，Chrome和Firefox（原始代码在其中任何一个都不起作用）所以我几乎要说它当然也适用于IE10：

println('X123 = '  + document.forms['MyForm'].querySelector('[name="X123"]'));
println('123 = '   + document.forms['MyForm'].querySelector('[name="123"]'));
println('00123 = ' + document.forms['MyForm'].querySelector('[name="00123"]'));

请注意，[name="value"]中值的引号很重要，因为否则以数字开头的是CSS语法错误。

直播示例：

＆＃13;

function println(text) {
    document.getElementById('output').innerHTML += '<p>' + text + '</p>';
}
function test() {
    println('X123 = '  + document.forms['MyForm'].querySelector('[name="X123"]'));
    println('123 = '   + document.forms['MyForm'].querySelector('[name="123"]'));
    println('00123 = ' + document.forms['MyForm'].querySelector('[name="00123"]'));
}
test();

＆＃13;

<form name='MyForm'>
<input type='hidden' name='X123' value="X123 value"/>
<input type='hidden' name='123' value="123 value"/>
<input type='hidden' name='00123' value="00123 value" />
</form><div id='output'></div>

＆＃13;

如果你想要他们的价值观：

println('X123 = '  + document.forms['MyForm'].querySelector('[name="X123"]']).value);
println('123 = '   + document.forms['MyForm'].querySelector('[name="123"]']).value);
println('00123 = ' + document.forms['MyForm'].querySelector('[name="00123"]']).value);

＆＃13;

function println(text) {
    document.getElementById('output').innerHTML += '<p>' + text + '</p>';
}
function test() {
    println('X123 = '  + document.forms['MyForm'].querySelector('[name="X123"]').value);
    println('123 = '   + document.forms['MyForm'].querySelector('[name="123"]').value);
    println('00123 = ' + document.forms['MyForm'].querySelector('[name="00123"]').value);
}
test();

＆＃13;

<form name='MyForm'>
<input type='hidden' name='X123' value="X123 value"/>
<input type='hidden' name='123' value="123 value"/>
<input type='hidden' name='00123' value="00123 value" />
</form><div id='output'></div>

＆＃13;

Answer 2

我建议您避免使用以数字开头的名称或ID，如HTML4 specification所示。

您可以通过预先挂起名称来解决此问题，例如：

name="123"  -->  name="whatever-123"

Answer 3

您的代码：

document.forms['MyForm'].elements[name];

这是数字名称问题的原因是因为.elements可以作为集合引用 - 即使用数字引用来按顺序获取字段 - 以及名称。

因此，给它一个数字名称意味着它是否意味着你的意思是名为'123'的元素或表单中的第123个元素。你的意思是前者，但它试图给你后者。

解决方案很简单：只需为它们添加字母前缀。

IE 10：无法获取名称仅包含数字

3 个答案: