こんにちは、さまざまな種類の入力を含むテーブルがあり、そのうちのいくつかはチェックボックスです。
ユーザーが 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()
});
});