Javascript 如何获取每组中的所有单选按钮，并在每组中选中一个？

表单中单选按钮的范围。jQuery检查是否为每个组选择了一个收音机，如果没有，则向相关标签添加一个类

我已检查，组的名称已正确添加到变量“radio”中。有什么想法吗

$('.checkbox', this).each(function()
{
    var radio = $(this).attr("name");
    if ($('input[name='+ radio +']:checked').length) 
    {
        $('label[for=' + radio + ']').addClass('error_label');
        required = false;
    }
    else 
    {
        $('label[for=' + radio + ']').removeClass('error_label');
    }
});

---

我认为在添加类时，您应该这样检查：

if ($('input[name=' + radio + ']:radio:checked').length == 0) {
    // Add class...
}

---

我认为在添加类时，您应该这样检查：

if ($('input[name=' + radio + ']:radio:checked').length == 0) {
    // Add class...
}

---

这里有一个更有效的方法。此外，您可能不希望将“error”类添加到组中的所有单选按钮标签中

==已更新以在答案中包含代码===

HTML

<div class="radio-group">
    <h3>Group 1</h3>
    <input type="radio" name="group_1" id="opt1" value="1" />
    <label for="opt1">Option 1</label>
    <br />
    <input type="radio" name="group_1" id="opt2" value="2" />
    <label for="opt2">Option 2</label>
    <br />
    <input type="radio" name="group_1" id="opt3" value="3" />
    <label for="opt3">Option 3</label>
    <br />
</div>
<div class="radio-group">
    <h3>Group 2</h3>
    <input type="radio" name="group_2" id="opt4" value="1" />
    <label for="opt4">Option 1</label>
    <br />
    <input type="radio" name="group_2" id="opt5" value="2" />
    <label for="opt5">Option 2</label>
    <br />
    <input type="radio" name="group_2" id="opt6" value="3" />
    <label for="opt6">Option 3</label>
</div>
<div class="radio-group">
    <h3>Group 3</h3>
    <input type="radio" name="group_3" id="opt8" value="1" />
    <label for="opt8">Option 1</label>
    <br />
    <input type="radio" name="group_3" id="opt9" value="2" />
    <label for="opt9">Option 2</label>
    <br />
    <input type="radio" name="group_3" id="opt10" value="3" />
    <label for="opt10">Option 3</label>
</div>
<div>
    <input type="button" id="submit" value="Submit" />
</div>

---

这里有一个更有效的方法。此外，您可能不希望将“error”类添加到组中的所有单选按钮标签中

==已更新以在答案中包含代码===

HTML

<div class="radio-group">
    <h3>Group 1</h3>
    <input type="radio" name="group_1" id="opt1" value="1" />
    <label for="opt1">Option 1</label>
    <br />
    <input type="radio" name="group_1" id="opt2" value="2" />
    <label for="opt2">Option 2</label>
    <br />
    <input type="radio" name="group_1" id="opt3" value="3" />
    <label for="opt3">Option 3</label>
    <br />
</div>
<div class="radio-group">
    <h3>Group 2</h3>
    <input type="radio" name="group_2" id="opt4" value="1" />
    <label for="opt4">Option 1</label>
    <br />
    <input type="radio" name="group_2" id="opt5" value="2" />
    <label for="opt5">Option 2</label>
    <br />
    <input type="radio" name="group_2" id="opt6" value="3" />
    <label for="opt6">Option 3</label>
</div>
<div class="radio-group">
    <h3>Group 3</h3>
    <input type="radio" name="group_3" id="opt8" value="1" />
    <label for="opt8">Option 1</label>
    <br />
    <input type="radio" name="group_3" id="opt9" value="2" />
    <label for="opt9">Option 2</label>
    <br />
    <input type="radio" name="group_3" id="opt10" value="3" />
    <label for="opt10">Option 3</label>
</div>
<div>
    <input type="button" id="submit" value="Submit" />
</div>

---

选中其中一个单选按钮时，您正在添加

error\u标签

类，而不是像您的问题所暗示的那样。选中其中一个单选按钮时，您正在添加

error\u标签

类，而不是像您的问题所暗示的那样。使用

removeClass（）

当检查丢失的收音机时，也会有助于用户在尝试重新提交文件之前查看所有的arror是否已清除，但请在您的答案中张贴代码。堆栈溢出的目标是自包含的，很难讨论实际上不在这里的代码（例如，@charlietfl上面的评论没有可见的上下文可供构建）。@FrédéricHamidi会注意到这一点。感谢您指出。在检查丢失的收音机时使用

removeClass（）

，这也会有助于用户在尝试再次提交文件之前查看所有arror是否已清除，但也请在您的答案中发布代码。堆栈溢出的目标是自包含的，很难讨论实际上不在这里的代码（例如，@charlietfl上面的评论没有可见的上下文可供构建）。@FrédéricHamidi会注意到这一点。谢谢你指出。