自动填充单选按钮

Question

我正在尝试自动填充单选按钮类型，我正在这个网站上进行培训并使用它的代码在我的 google chrome 控制台上对其进行测试，但它返回未定义。

网站：https://benalexkeen.com/autofilling-forms-with-javascript/

html：view-source:https://benalexkeen.com/autofilling-forms-with-javascript/

我正在尝试使用此代码勾选第三个单选按钮：

var radioElements = document.getElementsByName("input3");

    for (var i=0; i<radioElements.length; i++) {
      if (radioElements[i].getAttribute('value') == 'Radio3') {
        radioElements[i].checked = true;
      }
    }

输出：

我试图调整这段代码以在另一个网站上打勾，但仍然有这个未定义的输出

Answer 1

如果您想要更容易阅读 IMO，这是另一种方法。

// Instead of var I used let.
let radioElements = document.getElementsByName("input3");
radioElements.forEach((input) => {
    if(input.value === "Radio3") input.checked = true;
})

<input type="radio" id="Radio1" name="input3" value="Radio1">
<label for="radio1">Radio 1</label><br>
<input type="radio" id="Radio2" name="input3" value="Radio2">
<label for="radio2">Radio 2</label><br>
<input type="radio" id="radio3" name="input3" value="Radio3">
<label for="radio3">Radio 3</label>

关于undefined，如果您编写的代码没有返回任何内容，它会执行此操作。虽然，这并不意味着不工作。

Answer 2

我希望这会有所帮助。你可能误会了属性值

var radioElements = document.getElementsByName("input3");

    for (var i=0; i<radioElements.length; i++) {
      if (radioElements[i].getAttribute('value') == 'radio3') {
        radioElements[i].checked = true;
      }
    }

<input type="radio" id="radio1" name="input3" value="radio1">
<label for="radio1">Redio 1</label><br>
<input type="radio" id="radio2" name="input3" value="radio2">
<label for="radio2">Redio 2</label><br>
<input type="radio" id="radio3" name="input3" value="radio3">
<label for="radio3">Radio 3</label>