Count +/- für Kontrollkästchen klicken und unclick

Question

Wenn ein Benutzer das Kontrollkästchen der Zähler #counter +1 klickt, das ist in Ordnung, aber wenn er abhebt es nicht -1 für das gleiche Kontrollkästchen. Ich möchte +1 setzen, wenn sie auf ein bestimmtes Kontrollkästchen klicken und die Markierung von -1 aufheben.

--JS--

$('.CheckBox').toggle(function(){ 
    $('#Counter').html('('+i+' Selected)'); 
    i++; 
}, function() { 

    $('#Counter').html('('+i+' Selected)'); 
    i--; 
}); 

--- --- PHP

do { ?> 

<div style="position:relative; width:100%; height:20px; background-color:#FF5300;" class="CheckBox" id="<?php echo $row_EX['x1']; ?>"> 

<input type="checkbox" name="<?php echo $row_EX['x2']; ?>" value="<?php echo $row_EX['x3']; ?>" style="cursor:pointer; "> 

<span style="position:relative; top:-2px; font-family:arial; color:#000; font-size:12px;"><?php echo $row_EX['lx4']; ?></span> 

</div> 

<div style="height:1px; width:1px;"></div> 
<?php } while ($row_EX = mysql_fetch_assoc($EY)); ?>  

<span style="position:relative; left:10px; top:6px; font-family:arial; font-size:16px;" id="counter">(0 Selected)</span> 

Answer 1

$('.CheckBox').change(function() { 
    if (this.checked) { 
    i++; 
    } else { 
    i--; 
    } 
    $('#Counter').html('('+i+' Selected)'); 
}); 

sicher, dass Sie initialisieren var i = 0;, wenn die Seite geladen wird.

Answer 2

Sie haben keinen Code, der hier mit einem Klick auf Checkbox beschäftigt. .toggle in jquery beschäftigt sich nur mit dem Verstecken/Zeigen von Elementen.

upd. Ich denke, Sie müssen nicht alle .checkbox Elemente durchlaufen, wie andere vorgeschlagen haben .. und Sie brauchen keine globale Variable i. Statt etwas wie

$('.CheckBox input').click(function(){ 
    $('#Counter').html('('+$('.CheckBox input:checked').length()+' Selected)'); 
} 

Answer 3

in der jQuery-Dokumentation heißt es ....

Description: Bind two or more handlers to the matched elements, to be executed on alternate clicks. 

.toggle(handler(eventObject), handler(eventObject) [, handler(eventObject)]) 
handler(eventObject)A function to execute every even time the element is clicked. 
handler(eventObject)A function to execute every odd time the element is clicked. 

so hat es nichts mit Schach zu tun/deaktivieren

tun es auf diese Weise

$('.CheckBox').click(function(){ 
    if($(this).attr('checked')){ 
     $('#Counter').html('('+i+' Selected)'); 
     i++; 
    }else{ 
     $('#Counter').html('('+i+' Selected)'); 
     i--;  
    } 
} 

ja klick statt toggle ... ich verpasse das und du schaust benutze attr statt

Answer 4

versuchen, einen anderen Ansatz:

$('.CheckBox').change(function(){ 

    var n_checkboxes_checked = $('.CheckBox:checked').length; 
    $('#Counter').html(n_checkboxes_checked + ' Selected'); 
}); 

Answer 5

jsFiddle Demo: http://jsfiddle.net/ENxnK/2

Nutzungsänderung() nicht umschalten()

var i = 0; 
$('.CheckBox').change(function() { 
    if ($(this).attr('checked')) { 
     i++; 
    } else { 
     i--; 
    } 

    $('#Counter').html('(' + i + ' Selected)'); 
});