[javascript] 선택한 라디오 버튼의 값을 얻는 방법?

JS 프로그램에 이상한 문제가 있습니다. 나는 이것이 제대로 작동했지만 어떤 이유로 더 이상 작동하지 않습니다. 라디오 버튼 (선택한 것)의 값을 찾아 변수로 반환하고 싶습니다. 어떤 이유로 그것은 계속 돌아옵니다 undefined.

내 코드는 다음과 같습니다.

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>



답변

다음과 같이 할 수 있습니다 :

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

편집 : 편집 제안에 대해 HATCHA와 jpsetung에게 감사드립니다.


답변

이것은 모든 탐색기에서 작동합니다.

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

이것은 모든 입력 유형의 값을 얻는 간단한 방법입니다. 또한 jQuery 경로를 포함 하지 않아도됩니다.


답변

document.forms.your-form-name.elements.radio-button-name.value


답변

jQuery 1.8부터 쿼리에 대한 올바른 구문은

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

$('input[@name="genderS"]:checked').val();더 이상은 아니지만 jQuery 1.7에서 작동했습니다 ( @ 사용 ).


답변

ECMAScript 6 버전

let genderS = Array.from(document.getElementsByName("genderS")).find(r => r.checked).value;


답변

가장 간단한 해결책 :

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


답변

이 시도

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;
}

여기에 바이올린 .