Select 页面上的任何单选按钮

Select any radio button on a page

我有两个单选组,我需要在更改时获取任何单选按钮的值。但是 jQuery 只有 return 单击第二组时第一组单选项的值。

感谢您将 :radio 添加到 .options 的建议 select 或者但我还有其他表单元素,例如 select,我会监视这些元素的变化。我们可以通过任何方式将其添加到变量中吗?

$('.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>

非常接近,只是只有一个 div 带有 .options class 并且所有表单元素都在其中。我只想要一个 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>