2013-01-03 3 views
0

J'essaie de cocher certaines cases à l'aide de jQuery et j'utilise souvent le code recommandé lors de la recherche de cases à cocher, mais il semble les vérifier au lieu de basculer.Activer/désactiver les cases à cocher uniquement, ne pas désélectionner

Voici un jsFiddle pour elle:

http://jsfiddle.net/wgHpG/

Le HTML:

<button id="priority-categories" class="btn">Priority</button> 

<input type="checkbox" name="category" value="1" id="1"> 
<input type="checkbox" name="category" value="2" id="2"> 
<input type="checkbox" name="category" value="3" id="3">​ 

Les js:

$('#priority-categories').click(function(){ 

    var categories = [1, 3]; 

    $.each(categories, function(key, value) { 
     $('#' + value).prop('checked', !$('#' + value).checked); 
    }); 
}); 

Répondre

3

.checked est pas une propriété de l'objet jquery représentant la case à cocher élément.

Utilisez .is(':checked') à la place

http://jsfiddle.net/wgHpG/1/

3

objets jQuery ne pas une propriété .checked, seuls les éléments DOM avoir.
$('#' + value).checked sera toujours undefined, et donc !$(..).checked sera toujours true.

Vous pouvez pass a callback to .prop:

$('#' + value).prop('checked', function(i, checked) { 
    return !checked; 
}); 

Notez que les ID commençant par les numéros ne sont pas valables dans HTML4.

0
$('#' + value).prop('checked', !$('#' + value).attr("checked")) 
+0

Veuillez développer votre réponse. –

1

changement à

$('#' + value).prop('checked', !$('#' + value).is(":checked")); 
2

éléments jQuery ne sont pas une propriété 'checked'. Vous devez soit utiliser une méthode jQuery pour vérifier si elle est cochée ou le reconvertir en un élément DOM

!$('#' + value)[0].checked 

ou

!$('#' + value).prop('checked') 
0

Ce code, alors qu'un peu bavard, basculera comme prévu - http://jsfiddle.net/wgHpG/2/

$('#priority-categories').click(function(){ 

    var categories = [1, 3]; 

    $.each(categories, function(key, value) { 
     if($('#'+value).is(':checked')) { 
      $('#' + value).prop('checked', false); 
     } else { 
      $('#' + value).prop('checked', true); 
     } 
    }); 
}); 
0

Une approche légèrement différente pourrait être d'utiliser jQuery pour sélectionner les nœuds puis juste activer la case DOM natif:

var categories = [1, 3]; 

$('#' + categories.join(',#')).each(function() { 
    this.checked = !this.checked; 
}); 
Questions connexes