이러한 jQuery 사용자 정의 확인란이 올바르게 작동하지 않습니다.

Question

내 사용자 정의 MacOSX 스타일 확인란을 내 사이트 (jQuery 플러그인)에 사용하려고 시도하지만 체크 할 때까지 실제로 $('#input').is(':checked');을 트리거하지 않습니다 선택을 취소하면 엉망이됩니다.

상자에 체크 표시를 할 때마다 노란색 배경을 추가하도록 선택한 줄에 CSS를 추가합니다. 그러나 나는 그들과 문제가있다. 나는 그것이이 작업을 수행하는 이유를 이해하지 않습니다

:이 이미지는 아래에 설명합니다.

function checkIt(id) { 
    if ($('#checkbox_' + id).is(':checked')) { 
     $('#' + id).addClass("selected"); 
    } 
    else { 
     $('#' + id).removeClass("selected"); 
    } 
} 

그리고 체크 박스를 클릭했을 때 나는이 온 클릭 전화 : 이것은 당신이 선을 확인할 때 노란색 배경을 추가 내 checkIt() 기능입니다.

<span class="inbox_check_holder"> 
<input type="checkbox" value="96874" onclick="checkIt(96874)" id="checkbox_96874" class="inbox_check" /> 
<div class="star_clicker" id="star_96874" onclick="addStar(96874)" title="Not starred"><span id="starimg_96874" class="not_starred"></span></div> 
</span> 

나는 <input /> 이상 추가 요소에 추가이 사용자 정의 체크 박스 jQuery 플러그인 함께 할 수있는 뭔가가 생각하고 다음은 PHP에 의해 생성되는 몇 가지 예를 마크 업이다.

여기에 jQuery checkbox plugin page이 필요하다면, 여기에 수많은 예제가 있습니다. (당연히) "Safari"스킨을 사용하고 있습니다.

Answer 1

는 on

$("body").on("change", ".inbox_check", function(e){ 
     e.stopPropagation(); 
    if($(this).is(":checked")) 
    $('#' + id).addClass("selected"); 
    else 
    $('#' + id).removeClass("selected"); 
}); 

http://jsfiddle.net/BXjg7/10/

delegate 예를

을 사용할 수 있습니다 JQuery와 1.7

$(".inbox_check").live("change",function(e){ 
e.stopPropagation(); 
if($(this).is(":checked")) 
$('#' + id).addClass("selected"); 
else 
$('#' + id).removeClass("selected"); 
}); 

http://jsfiddle.net/BXjg7/3/

시도3210

$("body").delegate(".inbox_check","change", function(e){ 
e.stopPropagation(); 
    if($(this).is(":checked")) 
    $('#' + id).addClass("selected"); 
    else 
    $('#' + id).removeClass("selected"); 
}); 

http://jsfiddle.net/BXjg7/15/