使用Javascript拉单选按钮值

Question

I have a form on my webpage that looks like this:

<form id="numberForm">
<input type="radio" name="number" value="singular"> singular <br>
<input type="radio" name="number" value="plural"> plural <br>
</form>

How do I pull the value of the currently selected radio button (without a submit action) in Javascript?

What I'd like is something along the lines of the following:

var formInput = document.getElementById("numberForm");
var numberInputValue = formInput.SELECTEDBUTTON.value;

Answer 1

Try this (using querySelector in JS) :

 function getSel() { var formInput = document.getElementById("numberForm"); var rb=formInput.querySelector('[type="radio"]:checked'); //get selected radio button document.getElementById('spVl').innerHTML = 'Selected value = '+rb.value; } 

 <form id="numberForm"> <input type="radio" name="number" value="singular"> singular <br> <input type="radio" name="number" value="plural"> plural <br> <input type="button" value="Get selected radio button value" onclick="getSel();" /><br> <span id="spVl"></span> </form> 

Answer 2

var form = document.getElementById('numberForm');
var radios = form.getElementsByTagName('input');

for(var i = 0; i < radios.length; ++i) {
  if(radios[i].checked) {
    console.log("Radio button '" + radios[i].value + "' is checked");
  }
}