嵌套数组和ID和NAME

时间:2015-03-21 10:13:08

标签: javascript jquery html

我想找到所选单选按钮的值的总和。

我对命名元素的了解,您可以为许多元素指定相同的名称,但每个标记的ID必须是唯一的。

<div class="set">
<div><input name="answers[1]" value="1" type="radio"/></div>
<div><input name="answers[1]" value="2" type="radio"/></div>
<div><input name="answers[1]" value="3" type="radio"/></div>   
<div><input name="answers[1]" value="4" type="radio"/></div>
</div>

<div class="set">
<div><input name="answers[2]" value="5" type="radio"/></div>
<div><input name="answers[2]" value="6" type="radio"/></div>
<div><input name="answers[2]" value="7" type="radio"/></div>   
<div><input name="answers[2]" value="8" type="radio"/></div>
</div>

这是我的代码,用于查找answer[1]

中选择了多少输入
//For each radio button if it is checked get the value and break.
var c=0;
   for (var i = 0; i < answer[1].length; i++)
       if (answer[i].checked){
           //radio is selected
           c+=answer[i].value;
           break;
        }
    alert(c);

如何在数组中循环?

如果它被更多地计算了,比如找到所选单选按钮的值与jscript的总和,如果它们在名称为set的DIV数组中的位置,并且DIV set是在另一个ID为opt的DIV中。

<div id="opt">
    <div class="set" name="set[1]">
        <div><input name="answers[1]" value="1" type="radio"/></div>
        <div><input name="answers[1]" value="2" type="radio"/></div>
        <div><input name="answers[1]" value="3" type="radio"/></div>   
        <div><input name="answers[1]" value="4" type="radio"/></div>
    </div>
    <div class="set" name="set[2]">
        <div><input name="answers[1]" value="5" type="radio"/></div>
        <div><input name="answers[1]" value="6" type="radio"/></div>
        <div><input name="answers[1]" value="7" type="radio"/></div>   
        <div><input name="answers[1]" value="8" type="radio"/></div>
    </div>
</div>

一般规则是什么?

如果我想用jquery解决这个问题怎么办?这会更容易吗?

1 个答案:

答案 0 :(得分:1)

var c=0;
  for (var i = 0; i < answer[1].length; i++)
   if (answer[i].checked){
       //radio is selected
       c+=answer[i].value;
       break;
    }
alert(c);

这是你的功能。这不会起作用。 JavaScript不知道answer[1]指的是什么。 HTML元素(少数例外)不直接链接为JavaScript变量。在循环中使用关键字break会导致循环完全停止。

使用getElementsByName有效。

var answers = document.getElementsByName("answer[1]");
var c=0;
  for (var i = 0; i < answers.length; i++)
   if (answers[i]checked){
       //radio is selected
       c+=answers[i].value;
    }
alert(c);

这将检索名为answer[1]的所有元素,并将其存储在HTML collection个已调用的答案中。现在我们可以循环遍历集合,就像它是一个数组一样。

您还可以通过以下方式缩小选择范围:

document.getElementsByName("set[1]")[0].getElementsByName("answer[1]");

这将选择名称为set[1]的所有元素,选择集合中的第一个元素(并且仅)[0],然后对其子项执行选择。