How to get value of selected radio button?

前端 未结 28 2239
温柔的废话
温柔的废话 2020-11-22 03:51

I want to get the selected value from a group of radio buttons.

Here\'s my HTML:

相关标签:
28条回答
  • 2020-11-22 04:48
    var rates = document.getElementById('rates').value;
    

    cannot get values of a radio button like that instead use

    rate_value = document.getElementById('r1').value;
    
    0 讨论(0)
  • 2020-11-22 04:49

    The one worked for me is given below from api.jquery.com.

    HTML

    <input type="radio" name="option" value="o1">option1</input>
    <input type="radio" name="option" value="o2">option2</input>
    

    JavaScript

    var selectedOption = $("input:radio[name=option]:checked").val()
    

    The variable selectedOption will contain the value of the selected radio button (i.e) o1 or o2

    0 讨论(0)
  • 2020-11-22 04:49

    HTML CODE:

    <input type="radio" name="rdoName" value="YES"/> <input type="radio" name="rdoName" value="NO"/>

    JQUERY CODE:

    var value= $("input:radio[name=rdoName]:checked").val();
    

    $("#btnSubmit").click(function(){
    var value=$("input:radio[name=rdoName]:checked").val();
    console.log(value);
    alert(value);
    })
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <input type="radio" name="rdoName" value="YES"/> YES
    <input type="radio" name="rdoName" value="NO"/> NO
    <br/>
    <input type="button"id="btnSubmit"value="Which one Selected"/>

    You will get

    value="YES" //if checked Radio Button with the value "YES"
    value="NO" //if checked Radio Button with the value "NO"
    
    0 讨论(0)
  • 2020-11-22 04:49

       var rates=document.getElementsByName("rate");
                for (i = 0; i < rates.length; i++) {
                if (rates[i].checked) {
                  console.log(rates[i].value);
                  rate=rates[i].value;
                  document.getElementById("rate").innerHTML = rate;
                  alert(rate);
                  
                }
              }
            <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>
            </br>
            <div id='rate'>
            </div>

    0 讨论(0)
  • 2020-11-22 04:50

    Use document.querySelector('input[type = radio]:checked').value; to get value of selected checkbox , you can use other attributes to get value like name = gender etc. please go through below snippet definitely it will helpful to you,

    Solution

    document.mainForm.onclick = function(){
        var gender = document.querySelector('input[name = gender]:checked').value;
        result.innerHTML = 'You Gender: '+gender;
    }
    <form id="mainForm" name="mainForm">
        <input type="radio" name="gender" value="Male" checked/>Male
        <input type="radio" name="gender" value="Female" />Female
        <input type="radio" name="gender" value="Others" />Others
    </form>
    <span id="result"></span>

    Thank-You

    0 讨论(0)
  • 2020-11-22 04:52

    You can also loop through the buttons with a forEach-loop on the elements

        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;
            }
        });
    
    0 讨论(0)
提交回复
热议问题