javascript 多个具有相同名称的单选按钮组
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/30791791/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Multiple Radio Button Groups With Same Name
提问by clamchoda
I have been passed down a complex application which dynamically creates HTML.
我得到了一个动态创建 HTML 的复杂应用程序。
The problem is, the previous person did not know that the "name" attribute of radio buttons actually is the group association.
问题是，之前的人不知道单选按钮的“名称”属性实际上是组关联。
With the following mark up, is there any way to put these in two groups
加上下面的标记，有没有办法把它们分成两组
<div>
<%-- would like this to be a seperate group without changing name--%>
<label class="radio-inline"><input type="radio" name="radio" value="1">Group 1 Option 1</label>
<label class="radio-inline"><input type="radio" name="radio" value="2">Group 1 Option 2</label>
<label class="radio-inline"><input type="radio" name="radio" value="3">Group 1 Option 3</label>
</div>
<div>
<%-- would like this to be a seperate group without changing name--%>
<label class="radio-inline"><input type="radio" name="radio" value="1">Group 2 Option 1</label>
<label class="radio-inline"><input type="radio" name="radio" value="2">Group 2 Option 2</label>
<label class="radio-inline"><input type="radio" name="radio" value="3">Group 2 Option 3</label>
</div>
Is there any div or anything I can wrap around them to separate the grouping? I have tried field set and legend but it has no effect. I know I could put each one in a form but then they will not all be submitted.
是否有任何 div 或任何我可以环绕它们来分隔分组的东西？我试过字段集和图例，但没有效果。我知道我可以把每一个都放在一个表格中，但它们不会全部提交。
回答by RJ.Hwang
Put them in different form tag
将它们放在不同形式的标签中
<form>
<label class="radio-inline"><input type="radio" name="radio" value="1">Group 1 Option 1</label>
<label class="radio-inline"><input type="radio" name="radio" value="2">Group 1 Option 2</label>
<label class="radio-inline"><input type="radio" name="radio" value="3">Group 1 Option 3</label>
</form>
<form>
<label class="radio-inline"><input type="radio" name="radio" value="1">Group 2 Option 1</label>
<label class="radio-inline"><input type="radio" name="radio" value="2">Group 2 Option 2</label>
<label class="radio-inline"><input type="radio" name="radio" value="3">Group 2 Option 3</label>
</form>
回答by Ryan
from my knowledge, you cant. the name of the radio button defines the group it is in, then in the handler for the submitted form, you call the name to get the selected option. using line separators or divs will not disassociate them with each other. you can only have one radio button for a group selected. if you only want them visually separated, Austin has the right idea.
据我所知，你不能。单选按钮的名称定义了它所在的组，然后在提交表单的处理程序中，您调用名称以获取所选选项。使用行分隔符或 div 不会使它们彼此分离。您只能为一组选择一个单选按钮。如果你只希望它们在视觉上分开，Austin 有正确的想法。
Changing the name of each individual group is your only option to allow 2 selected buttons.
更改每个单独组的名称是允许选择 2 个按钮的唯一选项。
回答by Austin Collins
I think you want to use <fieldset>, this will allow you to separate them within the same form.
我认为您想使用<fieldset>，这将允许您在同一表单中将它们分开。
Example: https://jsfiddle.net/ndn7jmh5/2/
示例：https: //jsfiddle.net/ndn7jmh5/2/
If you can't do that try using <br/>to separate them onto different lines.
如果您不能这样做，请尝试使用<br/>将它们分开到不同的行上。
