Question

我有这个HTML：

 <fieldset class="target-radios">
        <legend>Date Range</legend>
        <div>
          <input id="dateUnspecified" type="radio" name="muScheduleDateRange" value="0" selected-item="0">
        </div>
        <div>
          <input id="dateAll" type="radio" name="muScheduleDateRange" value="1" selected-item="0">
        </div>
        <div class="from-to">
          <input type="radio" id="dateFromTo" name="muScheduleDateRange" value="2" selected-item="0">
        </div>
</fieldset>

如何通过循环浏览每个组来选择指定的单选按钮（选定项）？理想循环每组只能工作一次。

试过这种方法，但不起作用＆amp;循环遍历每个组：

$('#targeting input:radio').each(function() {
    var name = $(this).attr('name'),
    selected = $(this).attr('selected-item');

    if(typeof selected !== 'undefined') {
        $('input[name='+ name +']:nth-child('+ selected +')').attr('checked', true);
    }
});

Answer 1

我不太清楚你的意思，但你可能会尝试类似的东西，

$('div').each(function () {
    // Determine the selected item id
    var selectedItemId = $(this).eq(0).attr('selected-item');

    // Check it
    $(this).find('input[value="' + selectedItemId + '"]').prop('checked', true);
});

此外，您可以为您的div提供与“ group ”相同的类，因此您可以使用$('.group').each()代替。

Answer 2

尽量不要构成自己的属性。我将data-selected-item替换为selected-item

$('div').each(function () {
    $('input', this).eq($(this).find('input').data('selected-item') - 1).prop('checked', true);
});

<强> jsFiddle example

更新

您可以根据您的更改尝试此变体：

$('input').each(function () {
    if ($(this).data('selected-item') == (parseInt($(this).val(), 10))) $(this).prop('checked', true);
});

<强> jsFiddle example

Answer 3

你必须记住元素是0索引的，所以减去1。

$('input[type=radio]').each(function () {
    var name = $(this).attr('name'),
        aselected = parseInt($(this).attr('selected-item'), 10) - 1;
    if (typeof aselected !== 'undefined') {
        $('input[type="radio"][name="' + name + '"]').eq(aselected).prop('checked', true);
    }
});

注意：您没有显示任何目标，只是添加了更改：

$('#targeting').find('input[type=radio]').each...

编辑重新：更新标记：删除aselector索引计算

上的-1

$('.target-radios').find('input[type=radio]').each(function () {
    var name = $(this).attr('name'),
        aselected = parseInt($(this).attr('selected-item'), 10);
    var me = 'input[type="radio"][name="' + name + '"]';
    if (typeof aselected !== 'undefined') {
        $(me).eq(aselected).prop('checked', true);
    }
});

Answer 4

工作DEMO

试试这个，我添加了targeting div，

$('#targeting div').each(function() {
    var name = $(this).children(0).attr('name');
    var selected = $(this).children(0).attr('selected-item'); 
    if(typeof selected !== 'undefined') {
        $('input[name='+ name +']:nth-child('+ selected +')').attr('checked', true);
    }
});

希望这有帮助，谢谢

Answer 5

<强> DEMO

这是

这将获得具有不同'name'属性的广播，因此将根据不同组的数量执行循环，即'name'属性

var divs = $('input').map(function () {
     return this.name
 }).get();
 var uniqueName = $.unique(divs);
 for( i=0 ; i<uniqueName.length;i++)
 {
var selected = $("input[name="+uniqueName[i]+"").attr('selected-item'); 
$('input[name='+ uniqueName[i] +']').eq(selected).attr('checked', true);
 }

希望这有帮助，谢谢

如何选择每个组的指定单选按钮

5 个答案: