Comment faire un bouton qui permettra de décocher toutes les cases?

J'ai ce code qui est possible de cocher/décocher toutes les cases à cocher et de cocher/décocher une seule case.

  <!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Persist checkboxes</title>
</head>
<body>
<div>
<label for="checkAll">Check all</label>
<input type="checkbox" id="checkAll">
</div>
<div>
<label for="option1">Option 1</label>
<input type="checkbox" id="option1">
</div>
<div>
<label for="option2">Option 2</label>
<input type="checkbox" id="option2">
</div>
<div>
<label for="option3">Option 3</label>
<input type="checkbox" id="option3">
</div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="http://cdn.jsdelivr.net/jquery.cookie/1.4.0/jquery.cookie.min.js"></script>
<script>
$("#checkAll").on("change", function() {
$(':checkbox').not(this).prop('checked', this.checked);
});
$(":checkbox").on("change", function(){
var checkboxValues = {};
$(":checkbox").each(function(){
checkboxValues[this.id] = this.checked;
});
$.cookie('checkboxValues', checkboxValues, { expires: 7, path: '/' })
});
function repopulateCheckboxes(){
var checkboxValues = $.cookie('checkboxValues');
if(checkboxValues){
Object.keys(checkboxValues).forEach(function(element) {
var checked = checkboxValues[element];
$("#" + element).prop('checked', checked);
});
}
}
$.cookie.json = true;
repopulateCheckboxes();
</script>

Ma question est que je veux faire un bouton qui permettra de disposer d'une fonction qui permettra d'effacer ou de décocher toutes les cases à cocher. Certains pourraient m'aider à le faire? Merci!

$(':checkbox') n'est pas valide. Utiliser $('input[type="checkbox"]')
:checkbox est une case à cocher filtre jQuery fournit.

OriginalL'auteur user3230425 | 2014-03-22

  1. 4
    <button type="reset">Uncheck all</button>
    Cela ne fonctionnera que si les éléments sont à l'intérieur d'un <form>...

    OriginalL'auteur Arryangga Aliev Pratamaputra

  2. 3

    Simple et rapide

    http://jsfiddle.net/techsin/Zq6Et/

    $('#btn').click(function(){
$("input[type='checkbox']").attr("checked",false);
});
    cela passe en boucle sur toutes les cases à cocher pour savoir si ses cochée ou pas. ma réponse existant devrait être plus rapide..
    c'est vrai aussi pour :checked, jquery non seulement de parcourir toutes les cases à cocher et de vérifier si cette option est cochée ou pas, mais de créer un autre tableau et enregistrer les bagages dans ce tableau..alors que dire de calcul plus coûteux. Juste parce que c'est fait par jquery ne veut pas dire que c'est comme par magie aucun sujet de préoccupation.
    à côté de toute façon c'est une question de comme 10ms..à moins de 30 000..cases à cocher vérifier sur et en dehors par seconde!! il n'existe pas de valeur dans cette optimisation.
    bon point. De toute façon, jquery, passe en boucle sur toutes les cases. MAIS dans ce cas, il doit régler tous leurs bagages attributs de faux, qui est un rétroprojecteur. Deuxième point - dans ce cas, d'accord.
    c'est vrai..je suppose, il revient à l'individu dev goût alors.

    OriginalL'auteur Muhammad Umer

  3. 2

    Essayer celui-ci ayant deux scénarios::

    1) Check all Checkboxes
1) UnCheck all Checkboxes

    JS Fiddle

    J'ai vu que vous avez inclus une zone de texte dans la démo. comment voulez-vous effacer la zone de texte?
    $('textboxId').val(''); c'est de savoir comment je
    Si vous souhaitez effacer chacune des zones de texte & les cases à cocher que vous devrez réinitialiser le formulaire à l'aide du bouton de réinitialisation ou de $("Form").reset()

    OriginalL'auteur Rahul

  4. 1

    Vous pouvez aller à http://jsfiddle.net/fh2nV/1/ lien

    ou
    Exemple de Code ci-dessous

    Html :

    <table border="1">
<tr>
<th><input type="checkbox" id="selectall"/></th>
<th>Cell phone</th>
</tr>
<tr>
<td align="center"><input type="checkbox" class="case" name="case" value="1"/></td>
<td>BlackBerry Bold 9650</td>
</tr>
<tr>
<td align="center"><input type="checkbox" class="case" name="case" value="2"/></td>
<td>Samsung Galaxy</td>
</tr>
<tr>
<td align="center"><input type="checkbox" class="case" name="case" value="3"/></td>
<td>Droid X</td>
</tr>
<tr>
<td align="center"><input type="checkbox" class="case" name="case" value="4"/></td>
<td>HTC Desire</td>
</tr>
<tr>
<td align="center"><input type="checkbox" class="case" name="case" value="5"/></td>
<td>Apple iPhone 4</td>
</tr>
</table>

    Jquery 

    $(function(){
//add multiple select /deselect functionality
$("#selectall").click(function () {
$('.case').attr('checked', this.checked);
});
//if all checkbox are selected, check the selectall checkbox
//and viceversa
$(".case").click(function(){
if($(".case").length == $(".case:checked").length) {
$("#selectall").attr("checked", "checked");
} else {
$("#selectall").removeAttr("checked");
}
});
});

    OriginalL'auteur Butani Vijay

  5. 0

    Utiliser un peu de jQuery pour réaliser ce que vous cherchez à faire.

    $("input[type='checkbox']").is(":checked").attr("checked",false)

    Qui devrait fonctionner. Il n'est pas testé si et ne peut être syntaxiquement correct. Il vous suffit de mettre dans un écouteur de clics pour n'importe quel élément.

    jeter erreur Uncaught TypeError: Object #<error> has no method 'attr'

    OriginalL'auteur TJC

  6. 0

    Vous pouvez simplement utiliser le bouton de réinitialisation pour cette fin:

    <input type="reset" />

    Violon

    Si il y a bien d'autres domaines:

    $('#unchk').click(function(){
$('input[type="checkbox"]').each(function(){
$(this).attr("checked",false);
});
});

    Violon 2

    Réinitialisation efface les autres domaines comme bien, donc pas recommandée ....
    son actuel html ne contient que des cases à cocher
    Les utilisateurs ont souvent omettre les autres champs à rendre la question plus courte, donc on ne peut pas vraiment dire 🙂
    Ok, alors je vais ajouter une autre solution si bychance l'utilisateur a d'autres domaines également
    est correct j'ai seulement compris les cases à cocher et aussi je suis à la recherche d'une fonction qui sera dans un bouton parce que le bouton serait un type d'envoi.

    OriginalL'auteur Zword