Kontrollkästchen ein/aus schalten

Question

Ich habe die folgenden:

$(document).ready(function()
{
    $("#select-all-teammembers").click(function() {
        $("input[name=recipients\\[\\]]").attr('checked', true);
    });                 
});

Ich möchte die id="select-all-teammembers" wenn sie angeklickt wird, um zwischen angekreuzt und nicht angekreuzt zu wechseln. Ideen? die nicht Dutzende von Codezeilen sind?

Answer 1

Ich denke, es ist einfacher, einfach einen Klick auszulösen:

$("#select-all-teammembers").click(function() {
    $("input[name=recipients\\[\\]]").trigger('click');
});

Answer 2

Verwenden Sie dieses Plugin:

$.fn.toggleCheck  =function() {
       if(this.tagName === 'INPUT') {
           $(this).prop('checked', !($(this).is(':checked')));
       }

   }

Dann

$('#myCheckBox').toggleCheck();

Answer 3

Seit jQuery 1.6 können Sie mit .prop(function) um den Prüfstatus jedes gefundenen Elements umzuschalten:

$("input[name=recipients\\[\\]]").prop('checked', function(_, checked) {
    return !checked;
});

Answer 4

In der Annahme, dass es sich um ein Bild handelt, mit dem das Kontrollkästchen aktiviert werden kann, funktioniert dies bei mir

<img src="something.gif" onclick="$('#checkboxid').prop('checked', !($('#checkboxid').is(':checked')));">
<input type="checkbox" id="checkboxid">

Answer 5

Wenn Sie jedes Kästchen einzeln umschalten möchten (ein einzelnes Kästchen funktioniert aber genauso gut):

Ich empfehle die Verwendung von .each() , da es leicht zu ändern ist, wenn Sie verschiedene Dinge geschehen lassen wollen, und trotzdem relativ kurz und leicht zu lesen ist.

z.B.:

// toggle all checkboxes, not all at once but toggle each one for its own checked state:
$('input[type="checkbox"]').each(function(){ this.checked = ! this.checked });

// check al even boxes, uncheck all odd boxes:
$('input[type="checkbox"]').each(function(i,cb){ cb.checked = (i%2 == 0); });

// set all to checked = x and only trigger change if it actually changed:
x = true;
$('input[type="checkbox"]').each(function(){
    if(this.checked != x){ this.checked = x; $(this).change();}  
});

nebenbei bemerkt... nicht sicher, warum jeder verwendet .attr() oder .prop() zu (un)überprüfen Dinge.

Soweit ich weiß, hat element.checked immer in allen Browsern gleich funktioniert?