javascript - 获取每个单选组中选中的单选按钮

Question

此代码尝试获取每个单选组中选中的单选按钮中的 value 属性的值。但无法让它发挥作用。谢谢

let doc = {};
    $('.radio-group').each(function () {
      doc.id = $(this).attr('_id');
      $(this).children.each(function () {
        let validName = $($(this):checked).attr('value');
        doc.checkedName = validName;
      }
    })

<div class='radio-group' _id='abc'>
  <label class='radio-item'>
    <input class='radio-icon' value='value 1' name='g' type='radio'></input>  
    <span class='radio-label'>choose me </span>
  </label>
<label class='radio-item'>
    <input class='radio-icon' value='value 2' name='g' type='radio'></input>  
    <span class='radio-label'>choose me </span>
  </label>
</div>

Answer 1

使用 $(".radio-group input:checked") 您可以选择 .radio-group 子级的每个选中输入。

$(".radio-group input").click(function(){
    var doc = [];
    $(".radio-group input:checked").each(function(index) {
        var id = $(this).closest(".radio-group").attr('_id');
        doc.push(id);
    });
    console.log(doc);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="radio-group" _id="id1">
    <input type="radio" /> 
    <label>Item 1</label>
</div>
<div class="radio-group" _id="id2">
    <input type="radio" /> 
    <label>Item 2</label>
</div>
<div class="radio-group" _id="id3">
    <input type="radio" /> 
    <label>Item 3</label>
</div>
<div class="radio-group" _id="id4">
    <input type="radio" /> 
    <label>Item 4</label>
</div>