如何检查多个单选按钮，具有相同名称的单选按钮？

Question

我想检查多个单选按钮，所有单选按钮名称相同但 ID 不同。

这是我的html代码，

 <span style="float:left;margin:0 0 0 10px">Proactivity</span>
        <label for="q11" style="width:auto;margin:0 60px 0 0;padding:0;"><input type="radio" id="qq[]" class="styled" value="Proactivity > Poor" name="q11[]">Poor</label>
        <label for="q11"  style="width:auto;margin:0 18px 0 0;padding:0;"><input type="radio" id="qqa[]" class="styled" value="Proactivity > Good" name="q11[]">Good</label>

        <br/><br/>
        <span style="float:left;margin:0 0 0 10px">Service/support</span>
        <label for="q11" style="width:auto;margin:0 60px 0 0;padding:0;"><input type="radio" id="qq[]" class="styled" value="Service/support > Poor" name="q11[]">Poor</label>
        <label for="q11"  style="width:auto;margin:0 18px 0 0;padding:0;"><input type="radio" id="qqa[]" class="styled" value="Service/support > Good" name="q11[]">Good</label>

        <br/><br/>
        <span style="float:left;margin:0 0 0 10px">Provision of <br />specialist skills</span>
        <label for="q11" style="width:auto;margin:0 60px 0 0;padding:0;"><input type="radio" id="qq[]" class="styled" value="Provision of specialist skills > Poor" name="q11[]">Poor</label>
        <label for="q11"  style="width:auto;margin:0 18px 0 0;padding:0;"><input type="radio" id="qqa[]" class="styled" value="Provision of specialist skills > Good" name="q11[]">Good</label>

Answer 1

你也可以像这样在你的名字数组中放一个数字（如果你使用 js，一个计数器）：

主动性： <input type="radio" name="myradio[0]"><input type="radio" name="myradio[0]">

服务/支持： <input type="radio" name="myradio[1]"><input type="radio" name="myradio[1]">

提供
专业技能： <input type="radio" name="myradio[2]"><input type="radio" name="myradio[2]">

Answer 2

请点击链接

http://jsfiddle.net/Cwalkdawg/3CxLD/2/

由于您坚持使用收音机，我会使用 jQuery 库来获取您的值。您可以向收音机添加一个类，它允许您选择该类并遍历它。这是违反直觉和肮脏的，但它会起作用。这个标记：

<input type="radio" class="rad" name="None" value="--" />None
<br />
<input type="radio" class="rad" name="Item1" value="Item1" />Item1
<br />
<input type="radio" class="rad" name="Item2" value="Item2" />Item2
<br />
<input type="radio" class="rad" name="Item3" value="Item3" />Item3
<br />
<input type="radio" class="rad" name="Item4" value="Item4" />Item4
<br />

与这个 jQuery 一起使用：

$(document).ready(function () {
    $("#button").click(function () {
        // Radios
        $(".rad:checked").each(function() {
            console.log("Radio: " + $(this).val());
        });
    });
})

在小提琴中，我还添加了复选框，只是为了向您展示它是多么容易，即以下标记（阅读起来更容易并且不那么模棱两可）：

<input name="choices" type="checkbox" value="something1" />Option 1
<br />
<input name="choices" type="checkbox" value="something2" />Option 2
<br />
<input name="choices" type="checkbox" value="something3" />Option 3
<br />
<input name="choices" type="checkbox" value="something4" />Option 4
<br />

与这个 jQuery 一起使用：

$("#button").click(function () {
    //Check boxes
    $("input:checkbox[name=choices]:checked").each(function() {
        console.log("Checkbox: " + $(this).val());
    });
});

您无法取消选择单选按钮，除非您想使用重置元素取消选择所有单选按钮，这将重置您的整个表单，或者为单选按钮创建自定义功能（无论如何都会清除所有选择）。

可以使用以下代码将取消选择路由到您的 name=None 单选按钮：

$(".rad[name=None]").click(function() {
    $(".rad").removeAttr("checked");
});

Answer 3

将单选按钮包装在表单标签中将允许具有相同名称的单选按钮组彼此独立运行。

http://jsfiddle.net/8qB56/

但是看看您要做什么，更改每个逻辑问题的输入名称更适合您，因为您正在处理看起来像单个表单的内容。

因此，也许您可​​以将name="q11[]" 更改为name="q11[proactivity]" 用于主动问题输入，name="q11[service]" 用于服务问题输入，name="q11[provision]" 用于供应问题输入。

这样做将允许来自这些输入的所有选定响应保留在服务器端的 q11 字段中，然后您可以随意处理数据（我假设 q11 代表“问题 11”或其他内容）为什么您如此坚持为所有这些输入保持相同的名称）。

Answer 4

当您对所有无线电输入使用相同的名称时，它们都属于一组。它不允许您进行单独的操作。

您必须为每个无线电组使用不同的名称

Answer 5

使用单选按钮选择多个项目似乎违反了可用性规则。如果这样做，您可以为它们提供不同的名称。

PS：您应该为每个单选按钮提供一个外部样式表。如果您以后想进行调整，那就太好了。

Answer 6

你不能。单选按钮可供单一选择。对于多项选择，您需要复选框。