Question

我有<FORM>其中我有一个项目的单选按钮。单选按钮的代码如下：

<tr>
    <td width="10%" align="right" name="Items"><p>Items</p></td>
    <td width="90%">
    <input type="radio" name="None" value="--">None
    <input type="radio" name="Item1" value="Item1">Item1
    <input type="radio" name="Item2" value="Item2">Item2
    <input type="radio" name="Item3" value="Item3">Item3
    <input type="radio" name="Item4" value="Item4">Item4
    </tr>

问题：我想让它选择多个单选按钮项目选项，以便一次性选择和提交，但能够实现它。

Answer 1

jsFiddle

由于您坚持使用无线电，我会使用jQuery库来获取您的值。您可以在无线电中添加class，然后您可以选择class并对其进行迭代。这是反直觉和肮脏的，但它会起作用。这个标记：

<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");
});

多个选项一次选择单选按钮

1 个答案:

jsFiddle