Deaktivieren Sie alle anderen Kontrollkästchen

Question

Ich muss alle anderen Kontrollkästchen deaktivieren, wenn ein Benutzer auf ein Kontrollkästchen klickt. Ziemlich genau das gleiche Verhalten wie ein Optionsfeld. Der Nutzer klickt auf "A" und die Kontrollkästchen "B" und "C" sind deaktiviert. Ich benutze jQuery, aber ich kann nicht herausfinden, wie dies zu erreichen ist. Irgendwelche Ideen?

Hier sind, wie die Kontrollkästchen gesetzt sind u:

<div class="sales_block_one"> 
<span class="sales_box_option_set"><input type="checkbox" value="1" id="exopt10i11553501716" name="optset[0][id]" /><label for="exopt10i11553501716">Test + &pound;100.00</label></span> 
<span class="sales_box_option_set"><input type="checkbox" value="2" id="exopt11i21553501716" name="optset[1][id]" /><label for="exopt11i21553501716">Test + &pound; 200.00</label></span> 
<span class="sales_box_option_set"><input type="checkbox" value="3" id="exopt12i31553501716" name="optset[2][id]" /><label for="exopt12i31553501716">Test 3 + &pound;400.00</label></span> 
</div> 

Answer 1

wenn alle Kontrollkästchen Geschwister sind, ist es einfach so,

$(':checkbox').change(function(){ 

    if (this.checked) { 
     $(this).siblings(':checkbox').attr('checked',false); 
    } 

}); 

crazy demo

Nun, wenn Sie wirklich wollen um das Verhalten des Radiobuttons zu kopieren, so einfach,

$(':checkbox').change(function(){ 
     this.checked = true; 
     $(this).siblings(':checkbox').attr('checked',false);  
}); 

crazy demo

---

Geschwister ist, wenn die Elemente eines gleichen Eltern/Behälter hat.

Probe

<div> 

<input type="checkbox" /><label>A</label> 
<input type="checkbox" /><label>B</label> 
<input type="checkbox" /><label>C</label> 
<input type="checkbox" />​<label>D</label> 

</div> 

daß, <input> s und s <label> sind Geschwister.

---

In Ihrem Fall, die es nicht Geschwister ist, können Sie es auf diese Weise tun können,

$('.sales_block_one :checkbox').change(function() { 
    var $self = this; // save the current object - checkbox that was clicked. 
    $self.checked = true; // make the clicked checkbox checked no matter what. 
    $($self).closest('span') // find the closest parent span... 
     .siblings('span.sales_box_option_set') // get the siblings of the span 
     .find(':checkbox').attr('checked',false); // then find the checbox inside each span and then uncheck it. 
});​ 

crazy demo

more about traversing

Answer 2

$("#checkboxA").click(function() { 
    var checkedStatus = this.checked; 
    $("#checkboxB_And_C_Selector").each(function() { 
     this.checked = !checkedStatus; 
    }); 
});