jQuery. 라디오 버튼에 클래스 추가/제거 - 작동하지 않음

Question

일련의 라디오 버튼과 체크 상자에 일반 클래스 (.is-checked와 같은 것)를 추가/제거해야합니다. 여기 내가 가지고있는 코드입니다 :

$(function() { 
    $('input[type="checkbox"], input[type="radio"]').each(function() { 
    $(this).on('click', function() { 
     $(this).parent().wrap('<div>').unwrap(); 
     // works great for checkboxes, but not for radios 
     if ($(this).prop('checked')) { 
      $(this).addClass('is-checked'); 
     } else { 
      $(this).removeClass('is-checked'); 
     } 
    }) 
    }) 
}) 

이 체크 박스에 완벽하게 작동하지만, 라디오 버튼에 추가됩니다 클래스에 결코 제거되지됩니다. 생각? 아이디어?

편집 실수로이 스크립트는 조건부로부터 IE8로드 될 것이라고 언급 무시 '확인'의사 선택이 지원되지 않습니다. 전체 기능은 IE8을 제외한 모든 기능을 완벽하게 지원하므로 브라우저와 가난한 사용자가이 기능을 사용하지 못하게합니다. 결국, 'is-checked'클래스는 : checked selector와 동일한 CSS를 트리거합니다.

$('input[type="checkbox"], input[type="radio"]').on('click', function() { 
     $(this).parent().wrap('<div>').unwrap(); 
     if (this.checked) { 
      $(this).addClass('is-checked'); 
     } else { 
      $(this).removeClass('is-checked'); 
     }  
}); 

Answer 1

지금 당신이 계신 참조 :

Answer 2

봅니다 기본 속성을 사용합니다. 문제는이 라인이다 :

$(this).removeClass('is-checked'); 

그것은 단지 클릭 된 요소에서 .is-checked를 제거합니다. 이것은 체크 박스에서 작동하지만, 라디오가 다르게 작동하기 때문에 이것이 작동하지 않습니다.

$(function() { 
    $('input[type="checkbox"], input[type="radio"]').on('click', function() { 
     $(this).parent().wrap('<div>').unwrap(); 
     $('input[type="checkbox"], input[type="radio"]').each(function() { 
      $(this).is(':checked') ? $(this).addClass('is-checked') : $(this).removeClass('is-checked'); 
     }); 
    }); 
}); 

http://jsfiddle.net/xzNPh/4/

Answer 3

방법에 대해 :이 문제를 해결하려면 같은 것을 할

var inputs = $('input[type="checkbox"], input[type="radio"]'); 
inputs.on('click', function() { 
    $(this).parent().wrap('<div>').unwrap(); 
    inputs.removeClass('is-checked'); 
    $(this).toggleClass('is-checked', $(this).prop('checked', true)); 
}); 

당신은 그것을 무엇을 설명하지 않은를, 그래서 당신의 경우 추측을 감행하지 않을 것이다 심지어 그 코드가 필요합니다. 예 : CSS 스타일링 만한다면 CSS는 여기에서 잘 할 것입니다.

그리고 fiddle