Как получить значение, если введенный вход проверен

Question

Я хочу получить значение, если вход проверен.

<input type="radio" name="radioGroup" value="check" /> 
<input type="radio" name="radioGroup" value="wrong" /> 
<input type="radio" name="radioGroup" value="wrong" /> 
<input type="radio" name="radioGroup" value="wrong" /> 
<button>Submit</button> 

в сценарии я стараюсь,

var a = document.getElementsByTagName("input").name; 
var btn = document.getElementsByTagName("button"); 
btn.onclick = function() { 
    if (a.checked == true) { 
     console.log(a.value); 
    } 
}; 

мне нужно поставить "идентификатор" на каждом входе ли? Я хочу чистый javascript, потому что я уже знаю код jQuery.

Answer 1

Вы можете использовать querySelector(), чтобы получить проверенный элемент. Также getElementsByTagName() возвращается HTMLCollection поэтому вам нужно выбрать первый, используя индекс в противном случае вы должны дать id затем использовать getElementById().

var btn = document.getElementsByTagName("button")[0]; 
 
// getting first button from HTMLCollection 
 
btn.onclick = function() { 
 
// binding click event handler 
 
    var a = document.querySelector('[name="radioGroup"]:checked'); 
 
    // getting checked checkbox 
 
    if (a) { 
 
    // checking a is defined or not , if not it means no checked buttons are there 
 
    console.log(a.value); 
 
    // logging it's value in console 
 
    } 
 
};

<input type="radio" name="radioGroup" value="check" /> 
 
<input type="radio" name="radioGroup" value="wrong" /> 
 
<input type="radio" name="radioGroup" value="wrong" /> 
 
<input type="radio" name="radioGroup" value="wrong" /> 
 
<button>Submit</button>

Answer 2

Метод getElementsByTagName() возвращает коллекцию всех элементов в документе с указанным именем тега как объект NodeList.

Объект NodeList представляет собой набор узлов. К узлам можно обращаться по номерам индексов. Индекс начинается с 0.

var a = document.getElementsByTagName("input"); 
var btn = document.getElementsByTagName("button"); 
btn[0].onclick = function() { 
    for(var i=0;i<a.length;i++){ 
     if (a[i].checked == true) { 
      console.log(a[i].value); 
     } 
    } 
}; 

Answer 3

на кнопке Click Вы можете использовать querySelector, чтобы получить результат. Следующий код поможет.

function GetSelected() 
{ 
    alert(document.querySelector('input[name="radioGroup"]:checked').value); 
} 


<input type="radio" name="radioGroup" value="check" /> 
<input type="radio" name="radioGroup" value="wrong" /> 
<input type="radio" name="radioGroup" value="wrong" /> 
<input type="radio" name="radioGroup" value="wrong" /> 
<button onclick="GetSelected()">Submit</button>