Comment pouvons-nous accéder à la valeur d'un bouton radio en utilisant le DOM?
Comment pouvons-nous accéder à la valeur d'un bouton radio en utilisant le DOM?
Pour eg. nous avons le bouton radio :
<input name="sex" type="radio" value="male">
<input name="sex" type="radio" value="female">
Ils sont à l'intérieur d'un formulaire avec nom form1
. Lorsque j'essaie
document.getElementByName("sex").value
il retourne "homme", toujours indépendamment de la valeur cochée.
Veuillez décidé sur quelle réponse est la bonne, peut-être le mien stackoverflow.com/a/32749112/1815624
OriginalL'auteur | 2009-03-02
Vous devez vous connecter pour publier un commentaire.
Juste pour "generify" Canavar de fonction très utile:
... qui serait désormais référencé ainsi:
Étrange que ce genre de chose n'est-ce pas déjà une partie de la prototype.js.
document.getElementsByName
qu'une seule fois (au lieu de N+2 fois) et l'affecter à une variable locale à l'extérieur de la boucle.Ce fut probablement la meilleure façon de le faire+ de 6 ans. Mais nous avons à présent document.querySelector et un puissant Sélecteur CSS la syntaxe, qui peuvent être utilisées avec beaucoup moins de code. jsperf exemples entre getElementsByName et d'une boucle for, contre le document.querySelector, pourrait montrer une méthode plus efficace que les autres sur certains navigateurs, mais probablement seulement si vous êtes en train de faire+ de 100k appels, et donc généralement négligeable différence de performances.
OriginalL'auteur Canuckster
Si vous avez besoin d'être sélectionné, la plupart des cadres de prendre en charge des fonctionnalités comme ceci:
Vous avez raison, j'ai mis à jour mon message.
Si vous ne voulez pas utiliser un framework, il suffit d'utiliser document.querySelector. Vérifiez également une liste plus complète de Sélecteur CSS la Syntaxe.
OriginalL'auteur ericteubert
Il ya un couple de façons.
1. Mettre un id sur chaque entrée
Ensuite, vous pouvez utiliser
document.getElementById("sex_male")
2. Utilisez quelque chose comme PrototypeJS (jQuery fonctionne aussi)
Ensuite, vous pouvez faire quelque chose comme ceci:
Ou même pour obtenir juste le "mâle" bouton radio:
Un moyen facile de commencer avec Prototype est d'inclure à partir de Google en ajoutant des ce entre le <head></head> balises de votre page:
OriginalL'auteur Mark Biek
Vous pouvez obtenir votre radio sélectionnée est la valeur par cette méthode :
OriginalL'auteur Canavar
Surpris que personne n'a suggéré en fait à l'aide du Sélecteur API:
Prise en charge du navigateur est bon
Et cela fonctionne si les boutons radio sont à l'extérieur d'un formulaire. Merci de bien vouloir.
OriginalL'auteur Daniel Worthington-Bodart
Si vous souhaitez être sélectionné, mais n'ont pas un cadre à portée de main, vous pouvez effectuer une itération sur l'élément de tableau à la recherche de celle qui est vérifié:
OriginalL'auteur Jarret Hardie
OriginalL'auteur Manu
Si vous utilisez
document.form1.sex
, vous êtes retourné un tableau.document.form1.sex[0]
= premier bouton radiodocument.form1.sex[1]
= deuxième bouton radioÀ vérifier quel est activée, vous devez boucle:
OriginalL'auteur Diodeus - James MacFarlane
Vous dire
getElementsByName('sex')[0].value
? (Il n'y a pasgetElementByName
.)Qui sera bien sûr toujours choisir le premier élément d'entrée avec ce nom — celui dont la valeur est en effet mâle. Que vous vérifiez pour voir si elle est sélectionnée par l'aide de la".vérifié la propriété.
Pour ce cas simple, vous pouvez vous en sortir avec:
Pour le cas général, vous devez faire une boucle sur chaque entrée radio pour voir ce qui est vérifié. Il serait probablement préférable d'obtenir la forme de l'objet premier (mettre un id sur la forme et l'utilisation de
document.getElementById
est généralement mieux que d'utiliser le nom de base du document.les formulaires de collecte), puis l'accès au formulaire.éléments.pour obtenir le sexe de la liste, au cas où il y a d'autres éléments sur la page, qui ontname="sex"
attributs (potentiellement d'autres choses que les champs de formulaire).OriginalL'auteur bobince
OriginalL'auteur LN G
OriginalL'auteur Yundong Cai