使用构造变量名称循环遍历表单上的单选按钮

Posted 2023-02-22

【中文标题】使用构造变量名称循环遍历表单上的单选按钮

【英文标题】：Loop through radio buttons on a form using a construted variable name

【发布时间】：2012-05-14 02:58:39

【问题描述】：

我在一个表单上有几个单选按钮，它们都分组为 3，当它们被点击时，我需要在它们上运行一个 JS 函数。在这个函数中，我循环遍历被按下按钮组中的单选按钮（即，如果该组被称为“abc_name”，则使用for (var i = 0; i < form.abc_name.length; i++) ）。

我想知道是否有一种方法可以使用构造的组名以相同的方式操作一组单选按钮？例如，如果我将“xyz”传递给函数，我需要代码为for (var i = 0; i < form.xyz_name.length; i++) 。谢谢。

【参考方案1】：

使用square bracket notation。

function loopDeLoop (xyz) 
    var elems = form.elements[xyz + "_name"],
        len = elems.length,
        i;
    for (i=0;i<len;i++)
        console.log(elems[i];
    

【讨论】：

谢谢，这正是我所需要的。

【参考方案2】：

你应该真的在这两种情况下都使用getElementsByName()；

for (var els = document.getElementsByName(xyz + '_name'), i=0; i<els.length;i++) 
    // something on els[i]

虽然您所拥有的直接等价物是：

for (var els = form.elements[xyz + "_name"];, i=0; i<els.length;i++) 
    // something on els[i]

【讨论】：

谢谢，马上就有戏了。但是，该建议背后的原因是什么？我认为它更快？

【参考方案3】：

使用[]属性语法：

function loop(s) 
   s += '_name';
   var inputs = form[s];

   for (var i = 0; i < inputs.length; ++i) 
       ...
   

当属性键是变量时，这是必需的 - a.b 语法仅在 b 是“文字”时才有效。