코드 뒤에서로드 할 때 선택된 체크 박스를 설정하십시오.

Question

다음과 같이 체크 박스 목록의 listitem을 코드에로드합니다.

'load the fuel types into the checklist box 
    For Each newitem As String In GetFuelTypes(Request.PhysicalApplicationPath & "OtherDataFiles\dataXML.xml") 
     cblFuelstoDisplay.Items.Add(New ListItem(newitem)) 
    Next 

항목을 선택하면 다음 jquery를 사용하여 CSS 스타일을 변경합니다. 영문 코드 숨김에서 선택한으로

$(document).ready(function() { 
      $("#cbxarea").on("change", ":checkbox", function() { 
       $(this).siblings("label").toggleClass("checkboxselected", $(this).is(":checked")); 

      });    
     }); 

하고 완벽하게 됐었 작품, 내가 처음 checkboxlist 항목을 설정하고 거기 CSS 스타일을 설정할 수 없습니다. doc.ready 후에 jquery에서 페이지로드 스타일을 어떻게 변경합니까? 내가 스크립트이 추가 시도했지만 여기

$("#cbxarea:checkbox").each(function() { 
       if($(this).is(":checked")) { 
        $(this).toggleClass("checkboxselected"); 
       } 
      }); 

를 작동하지 않았다 또한 형제 라벨 요소를 선택하지 않는, 당신은 선택기 사이의 공간을 사용합니다 체크 박스 마크 업

<fieldset style="height:140px;"> 
       <legend>Select a Fuel Type to Display</legend> 
       <div id="cbxarea" class="checkbox"> 
        <asp:CheckBoxList ID="cblFuelstoDisplay" runat="server" AutoPostBack="True" >    
        </asp:CheckBoxList> 
       </div>    
      </fieldset> 

Answer 1

입니다. 당신의 체크 박스가 정적 경우 이벤트 위임을 사용할 필요가 없다는 것을

$("#cbxarea").on("change", "input[type=checkbox]", function() { 
    $(this).siblings("label").toggleClass("checkboxselected", this.checked); 
}).change(); 

참고 :

$("#cbxarea input[type=checkbox]:checked") 
          .siblings('label') 
          .addClass("checkboxselected"); 

또한 변경 이벤트를 트리거 할 수 있습니다.

$("#cbxarea input[type=checkbox]").on("change", function() { }).change();