Articles

JavaScript Case
Posted by admin

Résumé: dans ce tutoriel, vous apprendrez comment utiliser JavaScript pour vérifier si une case est cochée, pour obtenir les valeurs des cases sélectionnées, et de sélectionner / désélectionner toutes les cases.

vérification si une case à cocher est cochée

pour obtenir l’état d’une case à cocher, cochée ou décochée, procédez comme suit:

  • tout d’abord, cochez la case à l’aide des méthodes de sélection DOM telles quegetElementById() ouquerySelector().
  • ensuite, accédez à la propriétéchecked de l’élément checkbox., Si sa propriétéchecked esttrue, alors la case à cocher est cochée; sinon, ce n’est pas le cas.,ox est cochée, vous utilisez le code suivant:

    Code language: JavaScript (javascript)

    en Outre, vous pouvez utiliser la balise querySelector() pour vérifier si le :checked sélecteur de ne pas retourner null, comme ceci:

    Code language: JavaScript (javascript)

    Si une case n’a pas la balise value attribut, sa valeur par défaut est 'on':

    Code language: HTML, XML (xml)

    Si vous obtenez le value l’attribut d’une case à cocher, vous obtenez toujours la 'on' string si la case est cochée ou non., Par exemple:

    Code language: JavaScript (javascript)

    Voir l’exemple suivant:

    Obtention de valeurs de plusieurs cases à cocher

    en Supposant que vous avez trois cases et vous souhaitez obtenir les valeurs de toutes les cases sélectionnées:

    Code language: HTML, XML (xml)

    Pour ce faire, vous devez ajouter deux attributs HTML à chaque case à cocher: name et value ., Les trois cases à cocher doivent avoir le même nom mais des valeurs distinctes, par exemple:

    pour sélectionner les cases à cocher sélectionnées, vous utilisez la méthode querySelector():

    Code language: JavaScript (javascript)

    et rassemblez la valeur de chaque case à cocher:

    Code language: JavaScript (javascript)

    ous ensemble:

    Le checkboxes.jsfichier:

cochez/décochez toutes les cases

parfois, vous pouvez vouloir cocher et décocher toutes les cases sur un formulaire., Voir l’exemple suivant:

Lorsque vous cliquez sur le bouton avec l’id btn, toutes les cases seront cochées si ils ne le sont pas, et non si elles sont déjà retirés.

tout d’abord, développez une fonctioncheck() qui vérifie ou décoche toutes les cases à cocher en fonction d’un argument d’entrée:

lorsque vous cliquez sur le bouton, vous pouvez appeler la fonctioncheck() pour sélectionner toutes les cases à cocher. La prochaine fois, lorsque vous cliquez sur le bouton, il devrait décocher toutes les cases à cocher.,

pour effectuer ce commutateur, vous devez réaffecter le gestionnaire d’événements click chaque fois que l’événement click se déclenche.

voici sélectionnez le bouton et attacher un écouteur d’événement clic:

Code language: JavaScript (javascript)

Le checkAll() fonction est la suivante:

Code language: JavaScript (javascript)

Le uncheckAll() fonction est:

Comment cela fonctionne:

Si vous cliquez sur le bouton, la balise uncheck() fonction est invoquée pour cocher toutes les cases. Ensuite, il réaffecte la fonction uncheckAll() au gestionnaire d’événements onclick.,

La prochaine fois, si vous cliquez sur le bouton, la fonction uncheckAll()est appelée pour décocher toutes les cases et réaffecter la fonction checkAll()au gestionnaire d’événements onclick.

Résumé

  • utilisez checkbox.checked propriété ou :check sélecteur de déterminer si une case est cochée.
  • interrogez l’attributvalue pour obtenir la valeur d’une case à cocher.
  • ce tutoriel a Été utile ?
  • Ouinon

Leave A Comment