jQuery, aby zaznaczyć i odznaczyć pola wyboru tylko pożary raz

Question

Mam bardzo prosty wymóg dla mojego jQuery: aby sprawdzić zestaw skrzynek, jeśli przycisk jest zaznaczony, i wyczyścić je wszystkie, jeśli inny jest zaznaczony.

JQuery działa, ale działa tylko raz - to znaczy, jeśli kliknę, aby je wszystkie sprawdzić (wszystkie pola zaznacz), a następnie kliknij, aby je wyczyścić (wszystkie pola są wyczyszczone), a następnie ponownie kliknij, aby je wszystkie sprawdzić - tam nie ma wpływu. Podobnie, jeśli ręcznie usuń zaznaczenie niektórych pól, a następnie kliknij, aby zaznaczyć ponownie wszystkie, nie ma efektu.

jQuery

$('#all').on('change', function() { 
    if (!$(this).is(':checked')) { 
     $('.country').attr('checked', false); 
    } else { 
     $('.country').attr('checked', true); 
    } 
}); 


$('#none').on('change', function() { 
    if (!$(this).is(':checked')) { 
     $('.country').attr('checked', true);  
    } else { 
     $('.country').attr('checked', false); 
    } 
}); 

HTML

<div class="subselect"> 
    <input type="radio" class="TLO" name="radio1" id="all" />Check All 
<br /> 
     <input type="radio" class="TLO" name="radio1" id="none" />Clear All 
     <br /> 
    </div> 

    <br /> 
    <br /> 
    <div class="cselect" id="countries"> 
     <input type="checkbox" class="country" />1 
     <br /> 
     <input type="checkbox" class="country" />2 
     <br /> 
     <input type="checkbox" class="country" />3 
    </div> 

jsFiddle http://jsfiddle.net/vsGtF/1/

Answer 1

zmienić .attr() do .prop().

$('#all').on('change', function() { 
    if (!$(this).is(':checked')) { 
     $('.country').prop('checked', false); 
    } else { 
     $('.country').prop('checked', true); 
    } 
});  
$('#none').on('change', function() { 
    if (!$(this).is(':checked')) { 
     $('.country').prop('checked', true);  
    } else { 
     $('.country').prop('checked', false); 
    } 
}); 

jsFiddle example

Można również zmniejszyć to po prostu:

$('#all').on('change', function() { 
    $('.country').prop('checked', $(this).is(':checked')); 
}); 
$('#none').on('change', function() { 
    $('.country').prop('checked', !$(this).is(':checked')); 
}); 

jsFiddle example

jako docs dla .attr() państwa:

Od wersji jQuery 1.6 metoda .attr() zwraca niezdefiniowane atrybuty , które nie zostały ustawione. Aby pobrać i zmienić właściwości DOM, takie jak sprawdzony, zaznaczony lub wyłączony stan elementów formularza, należy użyć metody .prop().

Answer 2

wiem, że zostało to nabrać dużo tutaj, ale zrobiłem coś przeoczyć, miałem:

id = $(this).attr('id'); 
if($('#checkbox_' + id).prop('checked')){ 
    $('#checkbox_' + id).attr('checked', false); 
} else { 
    $('#checkbox_' + id).attr('checked', true); 
} 

jak wspomniano powyżej WSZELKIE przypadki attr potrzebie zamiana na podporze()

if($('#checkbox_' + id).prop('checked')){ 
    $('#checkbox_' + id).prop('checked', false); 
} else { 
    $('#checkbox_' + id).prop('checked', true); 
} 

nadzieję, że pomoże ktoś ...