JQuery와 : UL 리튬 내부의 선택을 취소 subchild 확인란

Question

나는이 같은 코드 :

<ul> 
    <li><input type="checkbox" level="child" name="somename1" value="1" /> Child 1</li> 
    <li><input type="checkbox" level="child" name="somename2" value="2" /> Child 2 <br /> 
      <ul> 
       <li><input type="checkbox" level="subchild" name="somename1" value="3" />Sub Child 1</li> 
       <li><input type="checkbox" level="subchild" name="somename2" value="3" />Sub Child 2</li> 
      </ul> 
    </li> 
    <li ><input type="checkbox" level="child" name="somename3" value="3" /> Child 3</li> 
</ul> 

및 JQuery와 코드 :

$('input[@type=checkbox][level="child"]').click(function (event) { 
     var checked = $(this).is(':checked'); 
     if (checked) { 
      alert("checked"); 
     } else { //for click child to uncheck subchild 
      alert("when unchecked"); 
      $(this).closest('ul > li').children('input[@type=checkbox][level="subchild"]').attr('checked', false); 

     } 
}); 

상황 : 아이 2 + subchild1 + subchild2 체크

문제점 : 내가 c를 선택 취소했을 때 subchild1 + subchild2의 선택을 취소하고 싶습니다. hild 2, 위의 코드는 작동하지 않습니다. 나는 그것이 다음과 관련이 있다고 생각합니다 :

$(this).closest('ul > li').children('input[@type=checkbox [level="subchild"]').attr('checked', false); 

어떤 도움이 될 것입니다. http://jsfiddle.net/p324w/

Answer 1

$('input[type=checkbox][level="child"]').click(function (event) { 
     var checked = $(this).is(':checked'); 
     if (checked) { 
      console.log("checked"); 
     } else { //for click child to uncheck subchild 
      $(this).parent().find('input[type=checkbox][level="subchild"]').prop('checked', false); 
     } 
}); 

jsFiddle example

몇 가지 참고 사항 : 여기 JSfiddle 당신이 당신의 유형 선택기에서 @을 사용하는 이유를 잘 모르겠어요

• 하지만 불필요
• 당신을 $(this).parent().find을 사용하여 DOM의 적절한 입력 요소로 이동해야합니다.
• .attr('checked', false) 대신 .prop('checked', false)을 사용하십시오.
• level은 (는) 유효한 속성이 아닙니다. 사용자 지정 특성이 필요한 경우 data-*을 사용하십시오.

Answer 2

Working FIDDLE Demo

이 시도 :

$('input[type=checkbox][level="child"]').on('click', function() { 
    // get checked status 
    var checked = $(this).is(':checked'); 

    // go up the dom to the parent of checkbox (li) 
    $(this).closest('li') 

     // find all subchild checkboxes 
     .find('input[type=checkbox][level="subchild"]') 

     // make them as the parent checkbox (checked or not) 
     .prop('checked', checked); 
});