我想从一组单选按钮中获得选定的值。

这是我的HTML:

<div id="rates">
  <input type="radio" id="r1" name="rate" value="Fixed Rate"> Fixed Rate
  <input type="radio" id="r2" name="rate" value="Variable Rate"> Variable Rate
  <input type="radio" id="r3" name="rate" value="Multi Rate" checked="checked"> Multi Rate  
</div>

这是我的js:

var rates = document.getElementById('rates').value;
var rate_value;
if(rates =='Fixed Rate'){
    rate_value = document.getElementById('r1').value;
    
}else if(rates =='Variable Rate'){
    rate_value = document.getElementById('r2').value;
    
}else if(rates =='Multi Rate'){
    rate_value = document.getElementById('r3').value;
}  

document.getElementById('results').innerHTML = rate_value;

我一直没有定义。


当前回答

https://codepen.io/anon/pen/YQxbZJ

HTML

<div id="rates">
<input type="radio" id="x1" name="rate" value="Fixed Rate"> Fixed Rate
<input type="radio" id="x2" name="rate" value="Variable Rate" 
checked="checked"> Variable Rate
<input type="radio" id="x3" name="rate" value="Multi Rate" > Multi Rate
</div>

<button id="rdio"> Check Radio </button>
<div id="check">

</div>

JS的

var x ,y;
var x = document.getElementById("check");
function boom()
{
if (document.getElementById("x1").checked)
  y = document.getElementById("x1").value;

else if(document.getElementById("x2").checked)
  y = document.getElementById("x2").value;

else if (document.getElementById("x3").checked)
  y = document.getElementById("x3").value;
else
  y = "kuch nhi;"
x.innerHTML = y;
}

var z = document.getElementById('rdio');
z.addEventListener("click", boom);`

其他回答

对前面建议功能的改进:

function getRadioValue(groupName) {
    var _result;
    try {
        var o_radio_group = document.getElementsByName(groupName);
        for (var a = 0; a < o_radio_group.length; a++) {
            if (o_radio_group[a].checked) {
                _result = o_radio_group[a].value;
                break;
            }
        }
    } catch (e) { }
    return _result;
}
var rates = document.getElementById('rates').value;

rates元素是一个div,所以它没有值。这可能就是未定义的来源。

checked属性会告诉你元素是否被选中:

if (document.getElementById('r1').checked) {
  rate_value = document.getElementById('r1').value;
}

Or

$("input[type='radio'][name='rate']:checked").val();

使用文档。querySelector('input[type = radio]:checked').value;要获得所选复选框的值,你可以使用其他属性来获取值,如名称=性别等,请通过下面的代码片段,它肯定会对你有帮助,

解决方案

document.mainForm.onclick = function(){ var gender = document.querySelector('input[name = gender]:checked').value; result.innerHTML = 'You Gender: '+gender; } <form id=“mainForm” name=“mainForm”> <输入类型=“收音机”名称=“性别”值=选中“男性”/>小 <输入类型=“收音机”名称=“性别”值=“女性”/>女性 <输入类型=“电台” 名称=“性别” 值=“其他” />其他 </form> <span id=“result”></span>

感谢

在php中,这很简单 html页面

男性<输入类型=“收音机” 名称=“收音机” 值=“男性”><br/> 母<输入类型=“收音机” 名称=“收音机” 值=“母”><br/> 其他<输入类型=“无线电” 名称=“无线电” 值=“其他”><br/> <输入类型=“提交”值=“提交”>

从表单到php取值

$radio=$_POST['radio'];<br/>
use php if(isset($_POST['submit']))<br/>
{<br/>
echo "you selected".$radio."thank u";<br/>
}

还可以在元素上使用forEach-loop循环遍历按钮

    var elements = document.getElementsByName('radioButton');
    var checkedButton;
    console.log(elements);
    elements.forEach(e => {
        if (e.checked) {
            //if radio button is checked, set sort style
            checkedButton = e.value;
        }
    });