jquery
2013-01-22 193 views 1 likes 
1

我有一個父級子類別複選框,子級具有子級子項。只有當父類別被點擊並且父類別未被選中時才需要顯示子類別,所有的子類別都需要隱藏。jQuery複選框選中取消選中子複選框

每件事情都可以正常工作,但是,假設檢查了子女和子女。現在,當超級父母未選中時,它隱藏了複選框,保留子選擇,應該取消選中。

這裏是我的代碼。

$(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/> 
&nbsp;&nbsp;<input type="checkbox" class="parent1" disabled="true" />child1<br/> 
&nbsp;&nbsp;<input type="checkbox" class="parent1" disabled="true"/>child2<br/> 
&nbsp;&nbsp;<input type="checkbox" class="parent1" disabled="true"/>child3<br/> 
<input type="checkbox" id="parent2" />parent<br/> 
&nbsp;&nbsp;<input type="checkbox" class="parent2" disabled="true"/>child1<br/> 
&nbsp;&nbsp;<input type="checkbox" class="parent2" 
id="parent3" disabled="true"/>child2-parent<br/> 
&nbsp;&nbsp;&nbsp;&nbsp;<input type="checkbox" 
class="parent3" disabled="true"/>child1<br/> 
&nbsp;&nbsp;&nbsp;&nbsp;<input type="checkbox" 
class="parent3" disabled="true"/>child2<br/> 
&nbsp;&nbsp;&nbsp;&nbsp;<input type="checkbox" 
class="parent3" disabled="true"/>child3<br/> 
&nbsp;&nbsp;&nbsp;&nbsp;<input type="checkbox" 
class="parent3" disabled="true"/>child4<br/> 
&nbsp;&nbsp;&nbsp;&nbsp;<input type="checkbox" 
class="parent3" id="parent4" disabled="true"/>child5-parent<br/> 
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type="checkbox" 
class="parent4" disabled="true"/>child1<br/> 
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type="checkbox" 
class="parent4" disabled="true"/>child2<br/> 

或者你可以在這裏試試看。

http://jsfiddle.net/DNDnT/4/

剛剛入住的所有複選框,然後單擊家長,你會明白我的問題。 謝謝。

我在我的項目中嘗試過的實際代碼是。

$(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'); 

    } 
}); 
}); 
+0

沒有時間與你的小提琴演奏,但也許嘗試這樣的事情' $(「。」+ its_id).attr('checked',false);' –

回答

0

我不認爲你寫的作品,只是看到你的小提琴。但是,如果這是你想要的東西,那麼你可以嘗試在第二個功能加入這一行:

$("."+its_id).attr('checked', false); 

$("."+its_id).attr('hidden', 'true'); 
+1

它只刪除當前類的選中值,那麼我的實際問題就是小孩的孩子。 –

+1

你可以看看更新的代碼。 ! –

相關問題