Comment vérifier et décocher toutes les cases à cocher à l'aide de JavaScript

Il peut y avoir une situation où toutes les cases doivent être cochées ou non contrôlées dans le cas d'un questionnaire ou d'un quiz. Par exemple, il est nécessaire de faire plusieurs sélections à partir d'une liste d'éléments spécifiques ou de ne faire aucune sélection, ou lorsque vous devez sélectionner ou effacer les options sélectionnées dans un formulaire en une seule fois. Dans de tels cas, vérifier et décocher toutes les cases à cocher à l'aide de JavaScript devient très pratique et sauvegarde dans le temps.

Cet article démontrera les méthodes de vérification et de déchaînement de toutes les cases à l'aide de JavaScript.

Comment vérifier et décocher toutes les cases à cocher à l'aide de JavaScript?

Pour vérifier et décocher toutes les cases à cocher en javascript, vous pouvez postuler:

• "document.getElementsByName»Méthode avec des cases
• "document.getElementsByName”Méthode avec boutons

Les approches mentionnées seront désormais discutées une par une!

Méthode 1: Vérifiez et décochez toutes les cases à cocher en javascript à l'aide de «Document.Méthode GetElementsByName () ”avec" Boxs "

Le "document.getElementsByName ()»La méthode renvoie les éléments avec le nom spécifié dans ses arguments. Cette méthode sera appliquée pour récupérer la valeur de chaque case à cocher à l'aide du nom passé.

Passons par l'exemple suivant pour la démonstration.

Exemple

Tout d'abord, le type d'entrée sera spécifié comme «cocher»Et un nom et une valeur spécifiques seront attribués à chaque case à cocher:

Python

Java

Javascrip

Maintenant, incluez une case à cocher supplémentaire avec la valeur "Vérifie tout"Et attachez un"sur clic()»Événement avec cette case à cocher qui fonctionnera de manière à ce que la case sera cliquée, le«Checkunched() »La méthode sera invoquée avec l'objet«ce«Comme argument:

Vérifie tout

Après cela, définissez une fonction nommée «Checkuncheck ()"Dans le fichier JavaScript, avec une variable nommée"cocher"Comme argument. Maintenant, accédez aux valeurs de la case à cocher à l'aide du «document.getElementsByName ()«Méthode et placer la valeur du«nom»Attribut comme son argument.

Enfin, appliquez un «pour”Boucle pour itérer le long de toutes les valeurs de case à cocher et utiliser le"vérifié”Propriété pour les marquer toutes comme vérifié:

Fonction CheckUnCheck (Checkbox)
get = document.getElementsByName ('Lang');
pour (var i = 0; iObtenez [je].coché = coche.vérifié;

Comme vous pouvez le voir, quand le «Vérifie tout»La case à cocher est marquée, toutes les autres cases à cocher sont également marquées comme cochées:

Méthode 2: Vérifiez et décochez toutes les cases à cocher en JavaScript à l'aide de «Document.Méthode GetElementsByName () »avec« boutons »

Le "document.getElementsByName ()»La méthode, comme discuté dans la méthode précédente, récupère les éléments avec le nom spécifié dans ses arguments. Il peut être utilisé pour vérifier ou décocher toutes les cases à cocher ajoutées sur une page Web.

Regardez l'exemple suivant pour la démonstration.

Exemple

Maintenant, nous inclurons deux boutons pour le ««Vérifie tout" et "Décocher tout»Fonctionnalités. Ensuite, attachez un "sur clic»Événement avec les deux bouton qui accédera séparément les fonctions spécifiées:

Ensuite, définissez une fonction nommée «vérifier()»Et appliquez le«document.getElementsByName«Méthode avec la valeur spécifiée du«nom" attribut. Ensuite, itérez le «pour”Boucle le long de toutes les valeurs de case discutées dans la méthode précédente.

De plus, lorsque le bouton associé est cliqué, le «vérifié»La propriété marquera toutes les cases à cocher et définira l'état coché comme«vrai»:

Fonction Check ()
var get = document.getElementsByName ('check');
pour (var i = 0; iObtenez [je].vérifié = true;

Ensuite, définissez une fonction nommée «Uncheck ()», Et ajoutez la fonctionnalité inverse pour marquer la propriété cochée de la boîte comme«FAUX»:

fonction Uncheck ()
var get = document.getElementsByName ('check');
pour (var i = 0; iObtenez [je].vérifié = false;

Il peut voir dans la sortie que les boutons ajoutés fonctionnent parfaitement:

Nous avons fourni les méthodes les plus faciles à cocher et à décocher toutes les cases à l'aide de JavaScript.

Conclusion

Pour vérifier et décocher toutes les cases à cocher à l'aide de JavaScript, utilisez le «document.getElementsByName ()"Méthode avec"Cocher les cases”Pour ajouter une case à cocher et accéder à la fonction, ce qui entraînera la cochon des cases ou appliquera la même méthode avec«Boutons"Pour inclure deux boutons séparément pour vérifier et décocher toutes les valeurs spécifiées. Cet article a expliqué les méthodes de vérification et de non-vérification de toutes les cases à cocher à l'aide de JavaScript.