javascript getelementby name

Question

我使用带有4个区域值的单选按钮

＆＃13;

＆＃13;

(function() {
  console.log(document.getElementsByName("regio1").value);
})();

＆＃13;

<input class="selectOwner" name="regio1" id="regio1" value="VL" type="radio" checked="">
<label for="regio1" class="text-left">Amsterdam</label>
<div class="field text-left">
  <input class="selectOwner" name="regio1" id="regio2" type="radio" value="WA">
  <label for="regio1" class="text-left">London</label>
</div>
<div class="field text-left">
  <input class="selectOwner" name="regio1" id="regio3" type="radio" value="BR">
  <label for="regio1" class="text-left">Brussel</label>
</div>
<div class="field text-left">
  <input class="selectOwner" name="regio1" id="regio4" type="radio" value="DU">
  <label for="regio1" class="text-left">Hamburg</label>
</div>

＆＃13;

＆＃13;

＆＃13;

使用alert getElementsByName时，获取错误值为undefined。

有人可以帮忙吗？

Answer 1

您可以使用:checked伪选择器...

选择已选中的一个

document.querySelector("#btn").addEventListener("click", function() {
    alert(document.querySelector("[name=regio]:checked").value);
});

<input class="selectOwner" name="regio" id="regio1" value="VL" type="radio" checked="">
<label for="regio1" class="text-left">Amsterdam</label>
<br/>
<input class="selectOwner" name="regio" id="regio2" type="radio" value="WA">
<label for="regio2" class="text-left">London</label>
<br/>
<input class="selectOwner" name="regio" id="regio3" type="radio" value="BR">
<label for="regio3" class="text-left">Brussel</label>
<br/>
<input class="selectOwner" name="regio" id="regio4" type="radio" value="DU">
<label for="regio4" class="text-left">Hamburg</label>
<br/>
<button id="btn">click me</button>

我还将广播组名称更改为regio，并修复了标签附件。

Answer 2

如果使用document.getElementsByName（“regio1”）; 它将返回带有regio1的所有节点

如果您想要

的值

<input class="selectOwner" name="regio1" id="regio1" value="VL" type="radio" checked=""><label for="regio1" class="text-left">Amsterdam</label>

然后你必须使用

var x = document.getElementsByName("regio1");
var y = x[0].value

并且y的值具有您想要的值

Answer 3

您需要指定要提醒的人。例如，如果你想提醒你的第一个regio1那么你会写这样的东西。 0是索引和第一项。

alert(document.getElementsByName("regio1")[0].value);

Answer 4

看一下这段代码：

＆＃13;

＆＃13;

var elems = document.getElementsByName( "regio1" );
for (var i in elems) {
  var elem = elems[ i ];
  if ( elems[ i ].checked )
    alert( elem.value )
}

＆＃13;

<input class="selectOwner" name="regio1" id="regio1" value="VL" type="radio" checked="">
<label for="regio1" class="text-left">Amsterdam</label>

<input class="selectOwner" name="regio1" id="regio2" type="radio" value="WA">
<label for="regio1" class="text-left">London</label>

<input class="selectOwner" name="regio1" id="regio3" type="radio" value="BR">
<label for="regio1" class="text-left">Brussel</label>

<input class="selectOwner" name="regio1" id="regio4" type="radio" value="DU">
<label for="regio1" class="text-left">Hamburg</label>

＆＃13;

＆＃13;

＆＃13;

Answer 5

document.getElementsByName获取HTML元素列表，不是唯一元素。