前提
jQueryで選択肢を選ぶと答えが変わるアンケートを作りたい。
アンケート自体は作れたのですが、
選択肢を選び直した時に思うように表示が切り替わりません。
実現したいこと
Q1に対してAとBの選択肢
Aを押すと回答1が表示される
Bを押すと回答2が表示される
↓
Aを選んだ状態でBを押す→回答1は非表示にして回答2を表示する
Bを選んだ状態でAを押す→回答2は非表示にして回答1を表示する
↓
以下ループ
発生している問題・エラーメッセージ
Aを押してある状態でBを押すとどちらも表示されなくなってしまう
(diplay:noneのままになる)
該当のソースコード
html
1 2<div class="Balloon_wrap" id="sec01"> 3 4 <dl class="Balloon reverse is-fadein"> 5 <dt></dt> 6 <dd class="que"> 7 <label><input type="radio" name="q1" id="a"><span class="enq_btn">A</span></span></label> 8 <label><input type="radio" name="q1" id="b"><span class="enq_btn">B</span></span></label> 9 </dd> 10</dl> 11 12</div> 13 14<!-- sec02 --> 15<div class="Balloon_wrap" id="sec02"> 16 17<dl class="Balloon"> 18 <dt><img src="#" alt=""></dt> 19 <dd style="width: 40%;height: 50px;"> 20 <span class="loader"></span> 21 </dd> 22</dl> 23 24<dl class="Balloon ans01"> 25<dt><img src="#" alt=""></dt> 26<dd>回答1</dd> 27</dl> 28 29<dl class="Balloon ans02"> 30<dt><img src="#" alt=""></dt> 31<dd>回答2</dd> 32</dl> 33 34<dl class="Balloon"> 35<dt><img src="#" alt=""></dt> 36<dd>・・・</dd> 37</dl> 38<dl class="Balloon"> 39<dt><img src="#" alt=""></dt> 40<dd>・・・</dd> 41</dl> 42 43</div> 44 45
jQuery
1 2$('#sec01 .que input').on('click',function(){ 3 $('#sec02').show(); 4 var loading = $('#sec02 .Balloon:nth-child(1)'); 5 $(loading).addClass('is-fadein'); 6 7 var ans = $(this).attr('id'); 8 if (ans == 'a'){ 9 var balloon = $('#sec02 .Balloon.ans01'); 10 $('#sec02 .Balloon.ans02').remove(); 11 }else{ 12 balloon = $('#sec02 .Balloon.ans02'); 13 $('#sec02 .Balloon.ans01').remove(); 14 } 15 16 var position = $('#sec02').offset().top; 17 $('body,html').animate({scrollTop:position}, 500, 'swing'); 18 19 setTimeout(function(){ 20 $(loading).hide(); 21 $(balloon).addClass('is-fadein'); 22 23 var sec = $('#sec02 .Balloon'); 24 $(sec).each(function (i) { 25 var delay = 500; 26 $(this).delay(i * delay).queue(function(next){ 27 $(this).addClass("is-fadein"); 28 next(); 29 }); 30 }); 31 },1200); 32 }); 33
###やってみたこと
・10、13行目のremove→toggle
・removeの戻り値を使ったif文の追加

回答3件
あなたの回答
tips
プレビュー
下記のような回答は推奨されていません。
このような回答には修正を依頼しましょう。
また依頼した内容が修正された場合は、修正依頼を取り消すようにしましょう。