getElementsByName() 不工作？ [复制]

Question

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

它最初与 getElementById() 一起工作，但是因为我必须重新设计我的表单，所以我不能使用 php 函数为元素分配一个单独的 ID，所以我所拥有的只是该元素的唯一名称.

所以我决定使用 JavaScript 中的 getElementsByName() 来修改元素。

这是该元素的 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() 一起使用？

• -我已检查它是文档中唯一的唯一元素。
• -我在激活该功能时检查了 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;
}