jQuery: décocher l'autre case à cocher sur une case cochée

j'ai un total de 6 cases à cocher (peut-être ajouter plus à l'avenir) et je veux permettre de n'en sélectionner qu'une Alors lorsque l'Utilisateur a coché l'une d'entre elles, l'autre devrait être décochée.

j'ai essayé avec ce code et fonctionne très bien si J'ai défini ID mais maintenant je me demande comment le faire vice versa de manière efficace donc à l'avenir si j'ajoute plus que ce ne sera pas un problème

$('#type1').click(function() {
     $('#type2').not('#type1').removeAttr('checked');
}); 
<td>

46
demandé sur Code Lover 2013-07-22 14:17:09
la source

6 ответов

Bind change handler, puis juste décocher toutes les cases à cocher, sauf celle cochée:

$('input.example').on('change', function() {
    $('input.example').not(this).prop('checked', false);  
});

Ici un violon

132
répondu billyonecan 2015-08-12 10:45:55
la source

vous pouvez utiliser la classe pour tous vos cases à cocher, et de faire:

$(".check_class").click(function() {
  $(".check_class").attr("checked", false); //uncheck all checkboxes
  $(this).attr("checked", true);  //check the clicked one
});
14
répondu Sudhir Bastakoti 2013-07-22 14:20:00
la source

Essayez ceci

 $(function() { 
  $('input[type="checkbox"]').bind('click',function() {
    $('input[type="checkbox"]').not(this).prop("checked", false);
  });
});
2
répondu Amit 2013-07-22 14:28:34
la source

Essayez ceci

$("[id*='type']").click(
function () {
var isCheckboxChecked = this.checked;
$("[id*='type']").attr('checked', false);
this.checked = isCheckboxChecked;
});

pour le rendre encore plus générique, vous pouvez également trouver des cases à cocher par la classe commune implémentée sur elles.

Modifié...

1
répondu Abhishek Jain 2013-07-22 14:31:11
la source

je pense que la méthode prop est plus commode quand il s'agit de l'attribut booléen. http://api.jquery.com/prop/

0
répondu nubinub 2013-07-22 14:26:25
la source
$('.cw2').change(function () {
    if ($('input.cw2').filter(':checked').length >= 1) {
        $('input.cw2').not(this).prop('checked', false);
    } 
});


$('td, input').prop(function (){
    $(this).css({ 'background-color': '#DFD8D1' });
    $(this).addClass('changed');
});
-1
répondu rogieo 2016-10-26 10:06:43
la source

Autres questions sur jquery checkbox