将单选按钮与包含元素组合在一起？

Question

将单选按钮组合在一起的标准方法是为每个单选按钮分配一个 name 属性，并将特定组中的每个单选按钮设置为相同的 "group name"，如下所示：

<p>
    Group 1:<br>
    <input type="radio" name="group1" value="val1">
    <input type="radio" name="group1" value="val2">
</p>
<p>
    Group 2:<br>
    <input type="radio" name="group2" value="val3">
    <input type="radio" name="group2" value="val4">
</p>

但是，当您为可以在页面上多次使用的网页开发部分代码时，不得不想出一个不同的 "group name" 是一个真正的痛苦。如果您可以将单选按钮与周围的元素组合在一起，那就更好了，就像这样：

<p>
    Group 1:<br>
    <radiogroup>
        <input type="radio" value="val1">
        <input type="radio" value="val2">
    </radiogroup>
</p>
<p>
    Group 2:<br>
    <radiogroup>
        <input type="radio" value="val3">
        <input type="radio" value="val4">
    </radiogroup>
</p>

这样的事情可能吗？否则，如果我的部分代码在页面上包含两次，前 2 input 的 2 个实例将全部包含在同一组中，第二个 2 input 的 2 个实例将全部包含被列入同一组。不过，我想要的是 4 组；每个部分包含 2 个组。

Answer 1

似乎没有办法做到这一点。我最终做的是为每个部分生成一个新的 GUID，并将其附加到该部分中单选按钮的 name 属性。

Answer 2

我使用带有 ID 的 span 属性将单选按钮列表组合在一起。

将单选按钮与包含元素组合在一起？

Grouping radio buttons together with a containing element?

html

radiobuttonlist

radio-group

radio-button