Question

以下是示例代码：

<form method="post" action="actions.php">
<div id="container">
<input type="checkbox" name="action1" id="a1-100" value="100"> Action 1 on 100
<input type="checkbox" name="action2" id="a2-100" value="100"> Action 2 on 100

<br><br><br><br>

<input type="checkbox" name="action1" id="a1-200" value="200"> Action 1 on 200
<input type="checkbox" name="action2" id="a2-200" value="200"> Action 2 on 200
</div>
<input type="submit" name="submit" value="Perform Actions">

将此示例列为PHP生成的复选框列表作为表单元素 - 其中PHP仅生成2个复选框，100个复选框和200个复选框。

对于每个唯一值，我只需要Action 1或Action 2。因此，如果对于值100，选中了Action 1，我希望取消选中Action 2作为值100，而不会影响其他值中的任何内容。

我怎样才能做到这一点？

Answer 1

最好的方法是使用单选按钮：

<form method="post" action="actions.php">
<div id="container">
<input type="radio" name="action-for-100" id="a1-100" value="100"> Action 1 on 100
<input type="radio" name="action-for-100" id="a2-100" value="100"> Action 2 on 100

<br><br><br><br>

<input type="radio" name="action-for-200" id="a1-200" value="200"> Action 1 on 200
<input type="radio" name="action-for-200" id="a2-200" value="200"> Action 2 on 200
</div>
<input type="submit" name="submit" value="Perform Actions">

请注意，我已更改了name属性，因此它将应该互斥的单选按钮组合在一起（例如，action-for-100而不是action1和action2 ）。

如果您绝对没有选择但要使用现有的HTML，那么您可以使用属性选择器：

$("#container input[type=checkbox]").click(function() {
    if (this.checked) {
        $("#container input[type=checkbox][value=" + this.value + "]")
            .not(this)
            .prop("checked", false);
    }
});

这将确保在选中“this”时，取消选中容器中具有相同value的所有其他复选框。如果你取消选中它，它什么都不做。

取消选中具有类似ID但名称不同的脚本生成复选框

1 个答案: