Comment obtenir la valeur de la radio avec jquery

jQuery est une bibliothèque JavaScript frontale très populaire. Dans le développement quotidien de pages, nous utilisons souvent des éléments de formulaire et le traitement des événements. Parmi eux, obtenir la valeur du bouton radio est une exigence courante. Ce qui suit explique comment utiliser jQuery pour obtenir la valeur du bouton radio.

Tout d’abord, nous devons préparer un ensemble de boîtes à boutons radio. Prenons comme exemple le code suivant :

<form>
  <input type="radio" name="gender" value="男"> 男
  <input type="radio" name="gender" value="女"> 女
</form>

Le nom et la valeur du bouton radio sont très importants. Le nom identifie un groupe de boutons radio, tandis que la valeur représente un identifiant unique pour chaque bouton radio. Notez que chaque bouton radio doit avoir le même nom.

Ensuite, nous pouvons utiliser les sélecteurs jQuery pour obtenir ces boutons radio. Comme indiqué ci-dessous :

var $radios = $('input[name="gender"]');

Ce sélecteur utilise le sélecteur d'attribut pour sélectionner tous les boutons radio nommés sexe.

Nous avons maintenant obtenu avec succès un ensemble de boutons radio. Cependant, nous devons également savoir quel bouton radio est sélectionné. Afin de réaliser cette fonction, nous pouvons utiliser la méthode prop() dans jQuery. La méthode prop() est utilisée pour obtenir ou définir la valeur d'attribut d'un élément. Il peut obtenir l'attribut vérifié de l'élément pour déterminer si un bouton radio est sélectionné. Le code est le suivant :

var selectedValue = $radios.filter(':checked').prop('value');

Dans ce code, nous utilisons la méthode filter() pour sélectionner le bouton radio sélectionné. Ensuite, utilisez la méthode prop() pour obtenir la valeur de ce bouton radio. La variable selectedValue représente la valeur du bouton radio sélectionné.

Enfin, si nous voulons obtenir le texte de l'étiquette du bouton radio sélectionné au lieu de la valeur, nous pouvons utiliser la méthode next() dans jQuery pour obtenir le texte de l'étiquette. Le code est le suivant :

var selectedLabelText = $radios.filter(':checked').next('label').text();

Explication : Depuis. boutons radio généralement Certains changements d'état seront contrôlés, nous pouvons donc mettre le code ci-dessus dans le gestionnaire d'événements pour qu'il s'exécute automatiquement lorsque l'utilisateur clique sur le bouton radio.

Le code ci-dessus montre comment utiliser jQuery pour obtenir la valeur du bouton radio. Dans le développement réel de pages, nous devrons peut-être gérer des éléments de formulaire et des événements plus complexes, et nous devons utiliser de manière exhaustive diverses méthodes et techniques jQuery pour accomplir la tâche.

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!