jQueryのトップ親を見つけ、この除き、その中にdivを取得
質問
1) when i clicked to any checkbox, a) i want to select radio in the same div b) unselect the other radios with their checkboxes. 2) When i click to radio, a) select all checkboxes in the same div. b) uncheck the other radios 3) is there any way to get parents without its first parent 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>
解決
すべてのラジオボタンは、同じ名前を共有していることを確認します:
<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内のすべてのチェックボックスをチェックし、イベントハンドラをアタッチします。
あなたはラジオボタンが他のラジオボタンをオフに、同じ名前を持っていることを確認するために忘れていない場合は、ブラウザによって自動的に行われる必要があります。
他のヒント
これは仕事とはるかに効率的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');
});
});
注意点として、あなたはラジオボタンすべてがstardards準拠するために、同じ名前を持っていることを確認する必要があります...
あなたがそれを行うことができない理由をいくつかの奇妙な理由がある場合は、あなたが(それによっては見苦しいなど)のチェックボックス結合ブロックの最後の行を変更することができます:
$(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');
// 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:共通名を必要とするラジオオプションを
。所属していません StackOverflow