1
1)チェックボックスをクリックすると、
  a) 同じ div 内のラジオを選択したい
  b) チェックボックスで他のラジオを選択解除します。

2)ラジオをクリックすると、
  a) 同じ div 内のすべてのチェックボックスを選択します。
  b) 他のラジオのチェックを外します

3) 最初の親 div なしで親を取得する方法はありますか?

どうやってやるの?

<div class="topDiv">
    <div class="repeaterDiv"><input type="radio" id="rpt_01_rb" />
        <input type="checkbox" id="rpt_01_cb1" />
        <input type="checkbox" id="rpt_01_cb2" />
        <input type="checkbox" id="rpt_01_cb3" />
    </div>
    <div class="repeaterDiv"><input type="radio" id="rpt_02_rb" />
        <input type="checkbox" id="rpt_02_cb1" />
        <input type="checkbox" id="rpt_02_cb2" />
        <input type="checkbox" id="rpt_02_cb3" />
    </div>
    <div class="repeaterDiv"><input type="radio" id="rpt_03_rb" />
        <input type="checkbox" id="rpt_03_cb1" />
        <input type="checkbox" id="rpt_04_cb2" />
        <input type="checkbox" id="rpt_05_cb3" />
    </div>
</div>
4

3 に答える 3

2

これは機能し、DrJokepuよりもはるかに効率的です。

$(function() {
    $('.repeaterDiv>:radio').bind('click',function() {
        $('.repeaterDiv>:checkbox').removeAttr('checked');
        $(this).siblings(':checkbox').attr('checked','checked');
    });

    $('.repeaterDiv>:checkbox').bind('click',function() {
        $('.repeaterDiv>:checkbox').removeAttr('checked');
        $(this).attr('checked','checked').siblings(':radio').attr('checked','checked');
    });
});

ちなみに、スターダードに準拠するには、ラジオボタンがすべて同じ名前であることを確認する必要があります...

それができない奇妙な理由がある場合は、チェックボックスバインディングブロックの最後の行を(見苦しいかもしれませんが)次のように変更できます。

$(this)
    .attr('checked','checked')
    .parent().siblings('.repeaterDiv').find(':radio')
    .removeAttr('checked');

    // I prefer to break the chain here but...
    // you could continue the above chain by doing: 
    // '.end().end().end().siblings(':radio').attr('checked','checked');'

$(this).siblings(':radio').attr('checked','checked');
于 2009-05-15T17:47:40.447 に答える
0
// when a radio is clicked, unselect any checkboxes in other groups
$('div.topDiv input[type=radio]').click(function() {
    $('div.topDiv div.repeaterDiv').not($(this).parent(".repeaterDiv")).children("input[type=checkbox]").attr('checked', '');
});

// when a checkbox is checked, and it's radio isn't, "click" its radio
// which in turn unchecks other boxes using event defined above
$('div.topDiv input[type=checkbox]').click(function() {
    if (!$(this).siblings('input[type=radio]').attr('checked')) {
        $(this).siblings('input[type=radio]').trigger('click');
    }
});

これにより、他のラジオオプションチェックグループのチェックボックスの選択が解除されます。他の人と同じ注意RE:共通の名前を必要とするラジオオプション。

于 2009-05-15T18:10:49.113 に答える
-1

すべてのラジオボタンが同じ名前を共有していることを確認してください。

<input type="radio" id="rpt_01_rb" name="rpt_rb" />
<input type="radio" id="rpt_02_rb" name="rpt_rb" />
// etc...

次に、次のコードを試してください(私はテストしていません)。

$('div.repeaterDiv>input[type=checkbox]').each(function(idx, item)
{
    $(item).click(function()
    {
        $(item).siblings('input[type=radio]:first').attr('checked', 'checked');
    });
});

$('div.repeaterDiv>input[type=radio]').each(function(idx, item)
{
    $(item).click(function()
    {
        $(item).siblings('input[type=checkbox]').attr('checked', 'checked');
    });
});

ここでは何が起きるのですか?

最初の部分は、divのチェックボックスをループし、それぞれにイベントハンドラーをアタッチします。このイベントハンドラーは、同じdivのラジオボタンをチェックします。

同様に、2番目の部分は、divのラジオボタンをループして、同じdivのすべてのチェックボックスをチェックするイベントハンドラーをアタッチします。

ラジオボタンの名前が同じであることを確認するのを忘れた場合は、他のラジオボタンのチェックを外すとブラウザによって自動的に行われるはずです。

于 2009-05-15T17:29:36.997 に答える