JQuery - case à cocher Activer/désactiver

Question

J’ai un tas de cases à cocher comme ça. Si la case « Vérifier ma » est cochée, toutes les autres 3 cases doivent être activés, sinon ils doivent être désactivées. Comment puis-je faire cela à l’aide de Jquery ?

Answer 1

Changer votre balisage un peu :

Et puis

Vous pouvez le faire en utilisant les sélecteurs d’attribut sans introduire les classes et les ID, mais il est plus lent et (AMHA) plus difficile à lire.

Answer 2

C'est le plus up-to-date de la solution.

<form name="frmChkForm" id="frmChkForm">
    <input type="checkbox" name="chkcc9" id="group1" />Check Me
    <input type="checkbox" name="chk9[120]" class="group1" />
    <input type="checkbox" name="chk9[140]" class="group1" />
    <input type="checkbox" name="chk9[150]" class="group1" />
</form>

$(function() {
    enable_cb();
    $("#group1").click(enable_cb);
});

function enable_cb() {
    $("input.group1").prop("disabled", !this.checked);
}

---

Voici les détails de l'utilisation pour .attr() et .prop().

jQuery 1.6+

Utiliser le nouveau .prop() fonction de:

$("input.group1").prop("disabled", true);
$("input.group1").prop("disabled", false);

jQuery 1.5 et au-dessous de

L' .prop() fonction n'est pas disponible, vous devez utiliser .attr().

Pour désactiver la case à cocher (par définition de la valeur de l'désactivé attribut) ne

$("input.group1").attr('disabled','disabled');

et pour l'activation (par la suppression de l'attribut entièrement) ne

$("input.group1").removeAttr('disabled');

N'importe quelle version de jQuery

Si vous travaillez avec un seul élément, il sera toujours plus rapide d'utiliser DOMElement.disabled = true. L'avantage à l'utilisation de l' .prop() et .attr() fonctions, c'est qu'ils fonctionnent sur tous les éléments qui correspondent.

// Assuming an event handler on a checkbox
if (this.disabled)

ref: Comment dois-je cocher une case avec jQuery?

Answer 3

<pre><code></code><p>Avec la fonctionnalité supplémentaire pour s’assurer le contrôle de case à cocher tout obtient vérifié/dechecked si toutes les cases à cocher individuelles sont vérifiées :</p><pre><code></code></pre></pre>