JQuery - Zdarzenie checkbox-change nie jest uruchamiane, jeśli jest zaznaczone przy użyciu JQuery

Question

Mam tę funkcję Check All, która sprawdza wszystkie pola wyboru. Używam do tego JQuery.

Ale ja też mam ten on change funkcję przełączania klasę div Wrapper:

$('input[type="checkbox"]').on('change', function(){ 
    $(this).closest('div').toggleClass('highlight'); 
}); 

ta funkcja działa kiedy kliknij pole wyboru, ale nie jeśli klikam Check all.

Czy istnieje sposób ręcznego uruchomienia zdarzenia przy użyciu JQuery? Czy istnieje lepsze rozwiązanie?

Dzięki

EDIT:

Oto uproszczony HTML:

<a id="check_all">Check All</a> 
<div> 
    <input type="checkbox" name="cb" value="abc">ABC<br> 
</div> 
<div> 
    <input type="checkbox" name="cb" value="pqr">PQR<br> 
</div> 
<div> 
    <input type="checkbox" name="cb" value="xyz">XYZ<br> 
</div> 

Oto JSFiddle

http://jsfiddle.net/DarcFiddle/d4VTh/

Answer 1

Po zameldowaniu click wszystkim należy wywołać zmiany() wydarzenie jak to

$(document).ready(function(){ 
    $("input[type='checkbox']").on('change', function(){ 
     $(this).closest('div').toggleClass('highlight'); 
    }); 

    $("#check_all").on('click', function(){ 
     $("input[type='checkbox']").prop('checked', true).change(); 
    }); 
}); 

Answer 2

Można spróbować,

$(document).on('change','input[type="checkbox]' ,function(){ 
    // $this will contain a reference to the checkbox 
     var $this = $(this); 
    if ($this.is(':checked')){//To CHECK CHECK BOX IS CHECKED OR NOT 
     $(this).closest('div').toggleClass('highlight'); 
    } 
}); 

nadzieję, że pomoże,

Answer 3

To wywoła zdarzenie change, ale dopiero po powiązać go jako pierwszy.

$('input[type="checkbox]').trigger('change'); 

Answer 4

niemal identyczny do odpowiedzi Visnu, ale bezpośrednio wywołującego kliknięcie() zadziała wszystkie zdarzenia kliknięcia związani jQuery. Jeśli to demonstrujesz, zobaczysz, że to odznacza pola, podczas gdy jego odpowiedź po prostu usuwa wyróżnienie, gdy pozostają one kliknięte.

$(document).ready(function(){ 
    $("input[type='checkbox']").on('change', function(){ 
     $(this).closest('div').toggleClass('highlight'); 
    }); 

    $("#check_all").on('click', function(){ 
     $("input[type='checkbox']").click(); 
    }); 
}); 

Answer 5

Sprawdź to skrzypce modyfikacja kodu: http://jsfiddle.net/d4VTh/51/

$(document).ready(function(){ 
    $("input[type='checkbox']").on('change', function(){ 
     if (this.checked) 
      $(this).closest('div').addClass('highlight'); 
     else 
      $(this).closest('div').removeClass('highlight'); 
    }); 

    $("#check_all").on('click', function(){ 
     var item = $("input[type='checkbox']") 
     item.prop('checked', !item.prop('checked')).change(); 
    }); 
});