选择页面上的任何单选按钮

Question

我有两个无线电组，我需要获取更改的任何单选按钮的值。但jQuery仅在第二组上单击时返回第一组无线电项目的值。

感谢您的建议，添加：收音机到.options选择器，但我有其他表单元素，如选择我监视变化。任何方式，我们可以添加这个变量？

$('.options').change(function() {   
 
     
 
     var checkedInput = $('.options input:checked').val(); 
 
     
 
     console.log('Checked input is : '+ checkedInput);  
 
     alert('Checked input is : '+ checkedInput);  
 
     
 
     });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<div class="options"> 
 
    
 
    <input type="radio" name="group-one" value="pink" checked > 
 
    <label for=""> pink </label> 
 
    <input type="radio" name="group-one" value="blue"> 
 
    <label for=""> blue </label> 
 
    <input type="radio" name="group-one" value="black"> 
 
    <label for=""> black </label> 
 
    <hr> 
 
    
 
    <input type="radio" name="group-two" value="orange"> 
 
    <label for=""> orange </label> 
 
    <input type="radio" name="group-two" value="banana"> 
 
    <label for=""> banana </label> 
 
    <input type="radio" name="group-two" value="apple"> 
 
    <label for=""> apple </label> 
 
    
 
</div>

Answer 1

非常关闭这一点，只有一个与可供选项类和所有形式的div元素在里面吧。我只需要一个var中的单选按钮的值。

$(function() { 
 
    var eleToSelect = '.options :radio'; 
 
    $(eleToSelect).change(function() { 
 

 
    var checkedInput = $(this).val(); 
 

 
    console.log('Checked input is : '+ checkedInput); 
 

 
    alert('Checked input is : '+ checkedInput); 
 
    $('#result').text('Checked input is : '+ checkedInput); // for the snippet 
 

 
    }); 
 
    eleToSelect = '.options1 select'; 
 
    $(eleToSelect).change(function() { 
 

 
    var checkedInput = $(this).val(); 
 

 
    console.log('Checked input is : '+ checkedInput); 
 

 
    alert('Checked input is : '+ checkedInput); 
 
    $('#result').text('Checked input is : '+ checkedInput); // for the snippet 
 

 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 

 
<div class="options"> 
 

 
    <input type="radio" name="group-one" value="pink" checked > 
 
    <label for=""> pink </label> 
 
    <input type="radio" name="group-one" value="blue"> 
 
    <label for=""> blue </label> 
 
    <input type="radio" name="group-one" value="black"> 
 
    <label for=""> black </label> 
 
    <hr> 
 

 
    <input type="radio" name="group-two" value="orange"> 
 
    <label for=""> orange </label> 
 
    <input type="radio" name="group-two" value="banana"> 
 
    <label for=""> banana </label> 
 
    <input type="radio" name="group-two" value="apple"> 
 
    <label for=""> apple </label> 
 
<br> 
 

 
    <select> 
 
     <option value="volvo">Volvo</option> 
 
     <option value="saab">Saab</option> 
 
     <option value="mercedes">Mercedes</option> 
 
     <option value="audi">Audi</option> 
 
    </select> 
 
</div>