jquery - 如何基于此脚本隐藏未选中的复选框？

Question

HTML

<div>Group 1
    <br>
    <label>
        <input type="checkbox" name="testing" value="B" checked="checked">A</label>
    <br />
    <label>
        <input type="checkbox" name="testing" value="I">B</label>
    <br />
    <label>
        <input type="checkbox" name="testing" value="A">C</label>
    <br />
</div>
<div>Group 2
    <br>
    <label>
        <input type="checkbox" name="testing2" value="B">A</label>
    <br />
    <label>
        <input type="checkbox" name="testing2" value="I">B</label>
    <br />
    <label>
        <input type="checkbox" name="testing2" value="A">C</label>
    <br />
</div>

JS

$("input:checkbox").change(function () {
    var checkname = $(this).attr("name");

    if (this.checked) {

        $("input:checkbox[name='" + checkname + "']").removeAttr("checked").parent().hide();
        this.checked = true;
        $(this).parent().show();
    } else {
        $("input:checkbox[name='" + checkname + "']").parent().show();
    }
});

选中复选框时的隐藏/显示脚本可以完美运行，但是如果复选框在窗口加载时初始检查，如何使其运行上述脚本以便隐藏其他未选中的脚本？

http://jsfiddle.net/warface/uvYzW/

Answer 1

您可以使用以下代码在已选中的复选框上触发更改事件并触发您的代码。

$("input:checkbox[checked]").trigger("change"); 

更新小提琴：http: //jsfiddle.net/uvYzW/2/

Answer 2

将此代码添加到末尾：

$(function(){
    $('input:checked').parent().siblings('label').hide();
    $('input:checked').parent().show();
});