如何使用JavaScript在一组无线电输入中获取选中的选项?

时间:2020-03-06 15:01:37  来源:igfitidea点击:

如何使用JavaScript在一组无线电输入中获取选中的选项?

解决方案

http://www.somacon.com/p143.php

<html>
  <head>
    <script type="text/javascript">
      function testR(){
        var x = document.getElementsByName('r')
        for(var k=0;k<x.length;k++)
          if(x[k].checked){
            alert('Option selected: ' + x[k].value)
          }

      }
    </script>
  </head>
  <body>
    <form>
      <input type="radio" id="r1" name="r" value="1">Yes</input>
      <input type="radio" id="r2" name="r" value="2">No</input>
      <input type="radio" id="r3" name="r" value="3">Don't Know</input>
      <br/>
      <input type="button" name="check" value="Test" onclick="testR()"/>
    </form>
  </body>
</html>

如果我们需要实际的元素,而不仅仅是选定的值,请尝试以下操作:

function findSelected(){
  for (i=0;i<document.formname.radioname.length;i++){
    if (document.formname.radioname[i].checked){
      return document.formname.radioname[i];
    }
  }
}

通用函数(基于函数)

function getRadioGroupSelectedElement(radioGroupName) {

    var radioGroup = document.getElementsByName(radioGroupName);
    var radioElement = radioGroup.length - 1;
    for(radioElement; radioElement >= 0; radioElement--) {
        if(radioGroup[radioElement].checked){
            return radioGroup[radioElement];
        }
    }
    return false;
}

function getRadioGroupSelectedValue(radioGroupName) {

    var selectedRadio = getRadioGroupSelectedElement(radioGroupName);
    if (selectedRadio !== false) {
        return selectedRadio.value;
    }
    return false;
}