Comment obtenir la valeur du bouton radio sélectionné ?

Question

J'ai un problème étrange avec mon programme JS. Je l'avais fait fonctionner correctement mais pour une raison quelconque, il ne fonctionne plus. Je veux juste trouver la valeur du bouton radio (celui qui est sélectionné) et la renvoyer à une variable. Pour une raison quelconque, il renvoie toujours undefined .

Voici mon code :

function findSelection(field) {
    var test = 'document.theForm.' + field;
    var sizes = test;

    alert(sizes);
        for (i=0; i < sizes.length; i++) {
            if (sizes[i].checked==true) {
            alert(sizes[i].value + ' you got a value');     
            return sizes[i].value;
        }
    }
}

submitForm :

function submitForm() {

    var genderS =  findSelection("genderS");
    alert(genderS);
}

HTML :

<form action="#n" name="theForm">

    <label for="gender">Gender: </label>
    <input type="radio" name="genderS" value="1" checked> Male
    <input type="radio" name="genderS" value="0" > Female<br><br>
    <a href="javascript: submitForm()">Search</A>
</form>

Answer 1

Cela fonctionne avec n'importe quel explorateur.

document.querySelector('input[name="genderS"]:checked').value;

Il s'agit d'un moyen simple d'obtenir la valeur de tout type d'entrée. Vous faites également pas doivent inclure le chemin de jQuery.

Answer 2

Vous pouvez faire quelque chose comme ça :

var radios = document.getElementsByName('genderS');

for (var i = 0, length = radios.length; i < length; i++) {
  if (radios[i].checked) {
    // do whatever you want with the checked radio
    alert(radios[i].value);

    // only one radio can be logically checked, don't check the rest
    break;
  }
}

<label for="gender">Gender: </label>
<input type="radio" name="genderS" value="1" checked="checked">Male</input>
<input type="radio" name="genderS" value="0">Female</input>

jsfiddle

Edit : Merci HATCHA et jpsetung pour vos suggestions d'édition.

Answer 3

Depuis jQuery 1.8, la syntaxe correcte de la requête est la suivante

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

Non $('input[@name="genderS"]:checked').val(); qui fonctionnait dans jQuery 1.7 (avec la fonction @ ).

Answer 4

Edit : Comme indiqué par Chips_100, vous devez utiliser :

var sizes = document.theForm[field];

directement sans utiliser la variable de test.

---

Vieille réponse :

Ne devriez-vous pas eval comme ça ?

var sizes = eval(test);

Je ne sais pas comment ça marche, mais pour moi, tu ne fais que copier une chaîne.

Answer 5

Essayez ceci

function findSelection(field) {
    var test = document.getElementsByName(field);
    var sizes = test.length;
    alert(sizes);
    for (i=0; i < sizes; i++) {
            if (test[i].checked==true) {
            alert(test[i].value + ' you got a value');     
            return test[i].value;
        }
    }
}

function submitForm() {

    var genderS =  findSelection("genderS");
    alert(genderS);
    return false;
}

Un violon ici .