Comment obtenir la valeur du bouton radio sélectionné à l'aide de js ?

Question

J'utilise ce code pour obtenir la valeur du bouton radio actuellement sélectionné, mais cela ne fonctionne pas.

var mailcopy = document.getElementById('mailCopy').value; 

Comment obtenir la valeur du bouton radio actuellement sélectionné en utilisant Javascript ?

Answer 1

HTML

<p>Gender</p>
<input type="radio" id="gender0" name="gender" value="Male">Male<br>
<input type="radio" id="gender1" name="gender" value="Female">Female<br>

JS

var gender = document.querySelector('input[name = "gender"]:checked').value;
document.writeln("You entered " + gender + " for your gender<br>");

Answer 2

Si vous utilisez jQuery, le code suivant fonctionnera pour vous.

$('input[name=radioName]:checked').val();

Answer 3

Les boutons radio se présentent sous la forme de groupes ayant le même nom et des identifiants différents. L'un d'entre eux aura la propriété checked définie sur true, alors bouclez sur eux jusqu'à ce que vous le trouviez.

function getCheckedRadio(radio_group) {
    for (var i = 0; i < radio_group.length; i++) {
        var button = radio_group[i];
        if (button.checked) {
            return button;
        }
    }
    return undefined;
}
var checkedButton = getCheckedRadio(document.forms.frmId.elements.groupName);
if (checkedButton) {
    alert("The value is " + checkedButton.value);
}

Answer 4

Vérifiez ceci

<input class="gender" type="radio" name="sex" value="male">Male
<br>
<input class="gender" type="radio" name="sex" value="female">Female

<script type="text/javascript">
$(document).ready(function () {
$(".gender").change(function () {

    var val = $('.gender:checked').val();
    alert(val);
});
});

</script>

Exemple

Answer 5

Peut-être que quelque chose m'échappe, mais le bon vieux JS standard ne fonctionnerait-il pas ? Je veux dire :

var selectedOption = document.getElementById('your-form-name')['radio-group-name'].value;

... ce qui n'est bien sûr valable que si vous avez fourni une "valeur" à vos éléments d'entrée radio.

<input type="radio" name="radio-group-name" value="red" checked>
<input type="radio" name="radio-group-name" value="blue">

La valeur doit être soit "rouge" soit "bleu" dans l'exemple ci-dessus.