jquery - 如果未在文档开始时选中 jQuery 隐藏复选框

Question

嗨，我有一张包含许多不同类型输入的表格，其中一些是复选框。

我限制用户检查 3 个复选框，但允许他们编辑其他复选框。但是，在页面加载时，我希望页面仅显示已选中的复选框并隐藏其他复选框。所以基本上我需要隐藏名为“contact_numbers”的表格行，如果它没有被检查的话。

我希望这在页面加载时完成，而不是在点击时完成，但我遇到了一些困难。如果有人能指出我正确的方向，那就太好了！

我的代码在下面或查看jsfiddle

$(document).ready(function () {
    if ($('.contact_no').attr('checked')) {
        $(this).closest('.contact_numbers').show()
    } else {
        $(this).closest('.contact_numbers').hide()
    }
    $("input[class='contact_no']").change(function () {
        var maxAllowed = 3;
        var cnt = $("input[class='contact_no']:checked").length;
        if (cnt > maxAllowed) {
            $(this).prop("checked", "");
            alert('Select  ' + maxAllowed + ' telephone numbers, uncheck one box to check another!');
        }
    });
    $("#add").click(function () {
        $(".contact_numbers:hidden:first").fadeIn("slow");
    });
    $(".contact_numbers").on('click', '.remove', function () {
        $(this).closest('.contact_numbers').hide()
    });
});

Answer 1

试试这个：

    $('.contact_no').each(function () {
        $this = $(this);
        if ($this.is(':checked')) {
            $this.parents('tr.contact_numbers').show()
        } else {
            $this.parents('tr.contact_numbers').hide()
        }
    });

检查这个小提琴

Answer 2

您可以使用.not()选择器

$('.contact_no:not(:checked)').closest('.contact_numbers').hide();

Working Demo