親子カテゴリチェックボックスがあり、子にはサブ子があります。子カテゴリは、親カテゴリがクリックされたときにのみ表示される必要があり、親カテゴリがオフになっている場合は、すべての子カテゴリを非表示にする必要があります。
すべてが正常に機能しますが、子とサブ子がチェックされているとします。スーパーペアレントのチェックを外すと、チェックボックスが非表示になり、サブチャイルドが選択されたままになり、チェックを外す必要があります。
これが私のコードです。
$(function () {
$(':checkbox').change(function () {
$("input[type='checkbox']:checked").each(function () {
var inner_id = $(this).attr('id');
if (inner_id.search("parent") > -1) {
// $("input."+inner_id).attr('hidden','false')
$("."+inner_id).removeAttr("hidden");
}
});
});
});
$(function () {
$(':checkbox').click(function () {
var is_chk = $(this).attr('checked');
var its_id = $(this).attr('id');
if (is_chk != 'checked') {
$("."+its_id).attr('hidden', 'true');
}
});
});
このためのhtmlコードはです。
<input type="checkbox" id="parent1" />parent<br/>
<input type="checkbox" class="parent1" disabled="true" />child1<br/>
<input type="checkbox" class="parent1" disabled="true"/>child2<br/>
<input type="checkbox" class="parent1" disabled="true"/>child3<br/>
<input type="checkbox" id="parent2" />parent<br/>
<input type="checkbox" class="parent2" disabled="true"/>child1<br/>
<input type="checkbox" class="parent2"
id="parent3" disabled="true"/>child2-parent<br/>
<input type="checkbox"
class="parent3" disabled="true"/>child1<br/>
<input type="checkbox"
class="parent3" disabled="true"/>child2<br/>
<input type="checkbox"
class="parent3" disabled="true"/>child3<br/>
<input type="checkbox"
class="parent3" disabled="true"/>child4<br/>
<input type="checkbox"
class="parent3" id="parent4" disabled="true"/>child5-parent<br/>
<input type="checkbox"
class="parent4" disabled="true"/>child1<br/>
<input type="checkbox"
class="parent4" disabled="true"/>child2<br/>
または、ここで試すことができます。
すべてのチェックボックスをオンにして、親をクリックするだけで、私の問題を理解できます。ありがとう。
私が私のプロジェクトで試した実際のコードはです。
$(function() {
$(':checkbox').change(function() {
$("input[type='checkbox']:checked").each(function() {
//var inner_id = $(this).attr('id');
var inner_id = $(this).attr('value');
var parId1="input."+inner_id;
var parId2="."+inner_id;
$(parId1).removeAttr("disabled");
$(parId2).removeAttr("hidden");
});
});
});
$(function() {
$(':checkbox').click(function() {
var is_chk = $(this).attr('checked');
var its_id = $(this).attr('value');
//var parId2="#"+its_id;
var parId1="input."+its_id;
var parId2="."+its_id;
if(is_chk!='checked') {
$(parId1).removeAttr("checked");
$(parId1).attr('disabled','true');
$(parId2).attr('hidden','true');
}
});
});