jquery를 사용하여 선택 상태를 기반으로 양식 레이블 스타일을 설정 하시겠습니까?

Question

내가 레이블을 클릭하면 라디오를 선택하고, 분명히

<label for="challenge" class="fat">Challenge 
    <input type="radio" name="create-what" value="challenge" id="challenge"> 
</label> 
<label for="team" class="fat">Team 
    <input type="radio" name="create-what" value="team" id="team"> 
</label> 

같이 라디오 버튼과 양식을 가지고있다. 내가해야할 일은 라디오 버튼의 선택된 상태에 따라 라벨의 클래스를 변경하는 것입니다. 따라서 선택한 라디오 레이블에 "활성"클래스를 추가하고 라디오가 선택되지 않은 경우 제거하십시오.

저는 이처럼 많은 쌍을 가지고있어서 가장 휴대하기 쉬운 방법을 찾고있었습니다. 감사. jQuery를에

Answer 1

는 checked 상태

$('input:radio').change(function(){ 

    $(this).parent().toggleClass('active', this.checked).siblings().removeClass('active'); 
}); 

toggleClass에 따라 클래스를 change 이벤트를 모니터링하고 전환하여 매우 간단합니다 추가하거나 제거 할 수 있는지 여부를 확인하기 위해 두 번째 인수에 대한 부울 수 있습니다. this.checked은 참이거나 거짓입니다.

당신은뿐만 아니라 페이지로드에서 실행이 필요하면 바로 트리거 change 페이지가로드 : [? 당신이 시도 무엇]

$('input:radio').change(function(){ 

    $(this).parent().toggleClass('active', this.checked).siblings().removeClass('active'); 
}).change();