getElementsByName()不起作用

Question

我有一个Javascript函数，它应该在我的表单中更新一个隐藏的输入字段，并在每次调用函数时增加一个数字。

它最初与getElementById()但是，因为我不得不重新设计我的表单，我不能使用php函数来分配一个单独的ID元素，所以我所有的是一个唯一的名称为该元素。

所以我决定使用getElementsByName()从Javascript修改元素。

元素

的HTML

  <input type="hidden" value="" name="staff_counter">

这是我的Javascript代码:

window.onload=function()
{
//function is activated by a form button 
var staffbox = document.getElementsByName('staff_counter');
                    staffbox.value = s;

                s++;
}

当函数被调用并且输入字段没有得到给定的值时，我在Firebug上没有得到错误。

它正在与getElementById()工作，但为什么突然它不与getElementsByName()工作?

• -我检查了它是文档中唯一的元素。
• -I检查激活函数时Firebug上的任何错误

以下是我从Codeigniter中使用的代码，用于制作元素

// staff_counter is name and the set_value function sets the value from what is
//posted so if the validation fails and the page is reloaded the form element does
// not lose its value
echo form_hidden('staff_counter', set_value('staff_counter'));

谢谢

Answer 1

document.getElementsByName()返回一个NodeList，因此您必须通过索引:document.getElementsByName('staff_counter')[0](取决于您有多少个索引)访问它。

您还可以访问length属性来检查匹配的元素数量

Answer 2

刚刚遇到了类似的问题，我通过对数组进行简单的循环解决了这个问题。下面的代码将遍历并禁用所有名为'btnSubmit'的按钮。

for (var i=0;i<document.getElementsByName('btnSubmit').length;i++){
    document.getElementsByName('btnSubmit')[i].disabled=true;
}