jQueryを使って、 カテゴリー「お知らせ」の子カテゴリー(inputタグ)を選択すると、カテゴリー「施工事例」の子カテゴリー(inputタグ)を選択できないようにしたいです。(逆もまたしかり)
HTML
1<div> 2 <p>お知らせ</p> 3 <ul class="one"> 4 <li> 5 <input class="item" id="info-1" name="category" type="checkbox"> 6 <label for="info-1">お知らせ1</label> 7 </li> 8 <li> 9 <input class="item" id="info-2" name="category" type="checkbox"> 10 <label for="info-2">お知らせ2</label> 11 </li> 12 </ul> 13</div> 14<div> 15 <p>施工事例</p> 16 <ul class="two"> 17 <li> 18 <input class="item" id="content-1" name="category" type="checkbox"> 19 <label for=""content-1">施工事例1</label> 20 </li> 21 <li> 22 <input class="item" id=""content-2" name="category" type="checkbox"> 23 <label for=""content-2">施工事例2</label> 24 </li> 25 </ul> 26</div>
jQuery
1//ul class=".one"の孫要素.class=itemをクリックした時 2$('.one').find('.item').on('click', function () { 3 4 //もしul class=".two"の孫要素.class=itemにcheckedがついていたら 5 if ($('.two').find('.item').prop('checked')) { 6 7 // twoの孫要素.class=item、checkedをfalseに。 8 $('.two').find('.item').prop('checked', false); 9 10 //それ以外は.oneの孫要素.class=itemをtrue 11 $(this).prop('checked', true); 12 } 13 });
これで良いと思ったのですが、全てのinputタグにcheckが付けられてしまいます。。。。
どうすれば、 カテゴリー「お知らせ」の子カテゴリー(inputタグ)を選択すると、カテゴリー「施工事例」の子カテゴリー(inputタグ)を選択できないようにできるでしょうか?(逆もまたしかり)
※子カテゴリーは複数選択できるようしたいです。
「選択できないようにする」と、一度、お知らせの方を選択したら、2度と施工事例は選択できなくなりますが、それでいいのですか。間違えて選択してしまうということはありえますが。
お知らせを選択していて、施工事例を選択したら、お知らせの方は選択解除するということが、ご希望のことではないですか。
回答3件
あなたの回答
tips
プレビュー