下面是我如何填写表格并处理已检查的收音机的获取。

使用名为myForm的表单：

<form id='myForm'>
    <input type='radio' name='radio1' class='radio1' value='val1' />
    <input type='radio' name='radio1' class='radio1' value='val2' />
    ...
</form>

从表单中获取值：

$('#myForm .radio1:checked').val();

如果您不发布表单，我会通过以下方式进一步简化：

<input type='radio' class='radio1' value='val1' />
<input type='radio' class='radio1' value='val2' />

然后获取检查值变为：

    $('.radio1:checked').val();

在输入上有类名可以让我轻松地设置输入的样式。。。

此解决方案不需要jQuery。

const RADIO_NAME = "radioName";
const radios = Array.from(document.getElementsByName(RADIO_NAME));
const checkedRadio = radios.filter(e=>e.checked);

这使用jQuery：

const radios = Array.from($(`[name=${RADIO_NAME}`));
const checkedRadio = radios.filter(e=>e.checked);

jQuery添加了这里不需要的额外抽象层。

您还可以使用：

const radios = Array.from(document.querySelectorAll(`[name=${RADIO_NAME}`));
const checkedRadio = radios.filter(e=>e.checked)[0];

但getElementsByName足够简单明了。

从这个问题中，我提出了一种替代方法，当您在相应标签的单击事件中时，可以访问当前选定的输入。原因是因为新选择的输入直到其标签的单击事件之后才更新。

TL；博士

$('label').click(function() {
  var selected = $('#' + $(this).attr('for')).val();

  ...
});

$（函数）{//这完全不能像上面解释的那样正常工作$（“#报告标签”）.click（function（）{var query=$（'input[name=“filter”]：checked'）.val（）；var time=（new Date（））.toString（）；$（'.query[data-method=“click event”]'）.html（query+'在'+time）；});//这是有效的，但在连续单击同一标签时无法更新$（'#报告的输入[name=“filter”]'）.on（'change'，function（）{var query=$（'input[name=“filter”]：checked'）.val（）；var time=（new Date（））.toString（）；$（'.query[data method=“change event”]'）.html（查询+'在'+time）；});//这是我想出的解决方案$（“#报告标签”）.click（function（）{var查询=$（“#”+$（this）.attr（'fr'））.val（）；var time=（new Date（））.toString（）；$（'.query[data-method=“click event with this”]'）.html（query+'at'+time）；});});输入[name=“filter”]{显示：无；}#报告的标签{背景色：#ccc；填充：5px；边距：5px；边界半径：5px；光标：指针；}.query查询{填充：5px；边距：5px；}.query:之前{content:“on”attr（数据方法）“：”；}[数据方法=“单击事件”]{颜色：红色；}[数据方法=“更改事件”]{颜色：#cc0；}[数据方法=“单击此事件”]{颜色：绿色；}<script src=“https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js“></script><form id=“reported”><input type=“radio”name=“filter”id=“question”value=“questions”checked=“checked”><label for=“question”>问题</label><input type=“radio”name=“filter”id=“answer”value=“answers”><label for=“answer”>答案</label><input type=“radio”name=“filter”id=“comment”value=“comments”><label for=“comment”>注释</label><input-type=“radio”name=“filter”id=“user”value=“users”><label for=“user”>用户</label><input type=“radio”name=“filter”id=“company”value=“companies”><label for=“company”>公司</label><div class=“query”data method=“click event”></div><div class=“query”data method=“change event”></div><div class=“query”data method=“click event with this”></div></form>

使用$（'input[name=“radioName”]'）.filter（“：checked”）.val（）；对我来说是最好的方式。

经过测试，这是可行的

Form

<form id="myForm">
  <input type="radio" name="radioName" value="Option1"> Option1
  <input type="radio" name="radioName" value="Option2" checked> Option2
  <input type="radio" name="radioName" value="Option3"> Option3
</form>

滑动分页

$(document).ready(function() {
  $('input[name="radioName"]').on('change', function() {
     const val = $(this).filter(":checked").val();
     alert(val);
  })

  // First load check
  const val = $('input[name="radioName"]').filter(":checked").val();
  alert(val);
});

此处示例：https://codepen.io/abinhho/pen/mdLrqbX

另一个选项是：

$('input[name=radioName]:checked').val()

jQuery插件，用于设置和获取单选按钮值。它还尊重他们身上的“变化”事件。

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <form id="toggle-form">
      <div id="radio">
        <input type="radio" id="radio1" name="radio" checked="checked" /><label for="radio1">Plot single</label>
        <input type="radio" id="radio2" name="radio"/><label for="radio2">Plot all</label>
      </div>
    </form>
    <script type="text/javascript">
    $( document ).ready(function() {
     //Get all radios:
     var radios = jQuery("input[type='radio']");
     checked_radios=radios.filter(":checked");
for(i=0;i<checked_radios.length;i++)
{
   console.log(checked_radios[i]);
}

    });
    </script>

或者其他方式

<script type="text/javascript">
$( document ).ready(function() {
  //Get all radios:
  checked_radios=jQuery('input[name=radio]:checked').val(); 
for(i=0;i<checked_radios.length;i++)
{
   console.log(checked_radios[i]);
}

});
</script>