当我再次检查另一个时,自动重新检查复选框

时间:2010-01-12 02:07:31

标签: javascript jquery

作为一名学生,我正在尝试学习一些JQuery技巧。 这是我的HTML

<div id="EngineGroup" class="OptionGroupStyle">
    <div id="GS300"><input id="GS300Check" name="GS300Check" type="checkbox" disabled="disabled" checked="checked"/>V6 250ch</div>
    <div id="GS300Price">53.000 €</div>
    <div id="GS430"><input id="GS430Check" name="GS430Check" type="checkbox"/>V8 283ch</div>
    <div id="GS430Price">58.000 €</div>
    <div id="GS450H"><input id="GS450HCheck" name="GS450HCheck" type="checkbox"/>V8 Hybride 345ch</div>
    <div id="GS450HPrice">63.000 €</div>
</div>

GS300是默认选项。

  • 选中“GS430Check”时 - &gt; GS300和GS450H未经检查
  • 选中“GS450HCheck”时 - &gt; GS300和GS430未经检查

可以
$("#GS430Check").click(function() {
        $("input[name=GS300Check]").attr("checked",false);
        $("input[name=GS450HCheck]").attr("checked",false);
});

对于GS450H

但是当我们取消选中/取消选择GS430或GS450H时,我怎样才能自动重新检查GS300? 我在JQuery中找不到类似ondeCheck / ondeSelect的东西,我是否想念一些东西,或者我是一个真正的菜鸟谁也听不懂真的很简单?

编辑:

$("#EngineGroup input").click(function() {
    if (!$("#EngineGroup input:checked").length) {
        $("#EngineGroup input:first").attr("checked", true);
    }
});

效果很好:)

3 个答案:

答案 0 :(得分:1)

如果您无法更改HTML,那么我建议单击保存复选框的当前状态可能更容易,然后取消选中所有框并将单击的复选框的状态翻转为与之前的状态相反。如果此后仍未检查,则只需选中默认复选框即可。这样你就可以在一个处理程序中完成所有操作,而不是每个复选框都有一个处理程序。

答案 1 :(得分:1)

您应该考虑在jQuery中使用is()方法来查看是否已检查某些内容:

if ($('#GS430Check').is(':checked')) {
  // do stuff...
}

答案 2 :(得分:0)

忘记jQuery的attr()is()以获取和设置复选框的选中性。对于这项任务来说,它们过于复杂且效率低下。相反,使用复选框元素的更简单的布尔checked属性:

if ( $('#GS430Check')[0].checked ) {
    $('#GS300Check')[0].checked = true;
}