javascript - 你如何在没有 jQuery 的情况下一次验证多个单选按钮？

Question

我正在为为我的类(class)提供给我的 html 代码编写验证函数，但除了添加标题和脚本外，不允许更改 html 代码。我还处于早期阶段，还不知道如何使用 jQuery，希望在验证多个单选按钮方面得到帮助。

我曾尝试在这个网站和许多其他网站上寻找答案，但似乎找不到。我尝试了多种代码，但我怀疑它们都是用 jQuery 制作的。

html 的输入

<input type = "radio" name = "radNewsletter" value = "" />Health and Wellness<br />
<input type = "radio" name = "radNewsletter" value = "" />Creative Writing<br />
<input type = "radio" name = "radNewsletter" value = ""/>Gardening

现有验证

    function validateForm() {
        var x = document.forms["frmNews"]["txtName"].value;
        if (x == "") {
            alert ("Name must be filled out.");
            return false;
            }
        var y = document.forms["frmNews"]["txtEmail"].value;
        if (y == "") {
            alert ("Email must be filled out.");
            return false;
            }

当我按下提交按钮时，除了表单验证之外，我无法获得任何其他输出，即使现有验证应该停止它也是如此。

Answer 1

我发现 radNewsletter 是您表单中的常用名称。为了验证单选按钮的表单，您可以使用以下代码。

function validateForm() {
        var radios = document.getElementsByName("radNewsletter");
        var formValid = false;

        var i = 0;
        while (!formValid && i < radios.length) {
            if (radios[i].checked) formValid = true;
            i++;        
        }

        if (!formValid) alert("Must check some option!");
        console.log(formValid)
        return formValid;
    }

<input type = "radio" name = "radNewsletter" value = "" />Health and Wellness<br />
<input type = "radio" name = "radNewsletter" value = "" />Creative Writing<br />
<input type = "radio" name = "radNewsletter" value = ""/>Gardening

<br />
<button onclick="validateForm()">Validate
</button>