jquery - 在页面加载时检查重复名称和单选按钮的值

Question

我有两组相同的单选按钮，一组在表格顶部和表格底部（一些 UI 要求）

问题是当我设置检查单选按钮时，只有底部的单选按钮被选中

这是我的代码：

//Top Set of Radio Buttons
<input name="optField"  value="Male" type="radio">Male
<input name="optField"  value="Female" type="radio">Female

//Table Here

//Bottom Set of Radio Buttons
<input name="optField"  value="Male" type="radio">Male
<input name="optField"  value="Female" type="radio">Female

jQuery代码：

 $(window).load(function(){

 var $radios = $('input[name=optField]');

 $radios.filter('[value="Male"]').attr('checked',true);

 });

Answer 1

您应该为两个选项组指定不同的名称属性。

HTML

<input name="optField"  value="Male" type="radio">Male
<input name="optField"  value="Female" type="radio">Female

//Bottom Set of Radio Buttons
<input name="optField2"  value="Male" type="radio">Male
<input name="optField2"  value="Female" type="radio">Female

JavaScript

$(window).load(function(){
    var $radios = $('input[name*="optField"]');
    $radios.filter('[value="Male"]').attr('checked',true);
});