Maison > interface Web > tutoriel CSS > Comment sélectionner toutes les cases sauf une à l'aide de jQuery ?

Comment sélectionner toutes les cases sauf une à l'aide de jQuery ?

Susan Sarandon
Libérer: 2024-11-11 16:07:02
original
565 Les gens l'ont consulté

How to Select All Checkboxes Except One using jQuery?

Sélection de cases à cocher avec jQuery

Dans le développement Web, les frameworks JavaScript comme jQuery offrent de puissants sélecteurs pour manipuler les éléments DOM. Un scénario courant consiste à cocher plusieurs cases sur un formulaire. Voici comment cocher sans effort toutes les cases à l'exception d'une case spécifique à l'aide de jQuery :

Considérez un balisage comme celui-ci :

<form>
  <table>
    <tr>
      <td><input type="checkbox">
Copier après la connexion

Lorsque la case avec id="select_all" est cliquée, l'objectif consiste à cocher ou décocher toutes les autres cases nommées select[].

Voici un jQuery solution :

$('#select_all').change(function() {
  var checkboxes = $(this).closest('form').find(':checkbox');
  checkboxes.prop('checked', $(this).is(':checked'));
});
Copier après la connexion

Ce code fait ce qui suit :

  1. Obtient la case à cocher nommée select_all en utilisant son identifiant.
  2. y attache un écouteur d'événement de changement.
  3. Lorsque l'écouteur est déclenché, il trouve toutes les cases à cocher dans le formulaire.
  4. Il définit ensuite la propriété cochée de toutes les cases à cocher trouvées en fonction de l'état coché de la case select_all.

Ce code bascule efficacement l'état coché de toutes les autres cases à cocher lorsque la case select_all est cliquée. Cependant, il est important de noter que le code ne fonctionnera que si les cases à cocher se trouvent dans le même formulaire que la case select_all.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Derniers articles par auteur
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal