-1

こんにちは、さまざまな種類の入力を含むテーブルがあり、そのうちのいくつかはチェックボックスです。

ユーザーが 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()
    });
});
4

2 に答える 2

1

これを試して:

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

このフィドルをチェックしてください

于 2013-10-21T14:36:09.973 に答える
0

.not()セレクターを使用できます

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

Working Demo

于 2013-10-21T14:38:10.583 に答える