条件文の混乱 - 3の場合show element

Question

3つの要素を選択できるようにする関数を作成しようとしていますが、3つの要素が選択されると「次へ」ボタンが表示されます。

私のユーザーは1つの回答の選択を解除し、別の回答を選択する必要があります。選択を解除すると、2つの要素のみが選択されて次のボタンが消えます。

イムは、これはあなたがこのようなあなたのコードを簡素化することができます...効率的

https://jsfiddle.net/p7uhf12L/

$('.answer').on('click',function(e){ 
    e.preventDefault(); 

    if($('.moreAnswers .selected').length === 3){ 
     $('.next-question').fadeIn(); 
     $('.next-question').css('opacity',1); 
     if($(this).is('.selected')){ 
      $(this).removeClass('selected'); 
     } 
    } else { 
     if($(this).is('.selected')){ 
      $(this).removeClass('selected'); 
      $('.next-question').css('opacity',0); 
     } else { 
      $(this).addClass('selected'); 
     } 
     $('.next-question').fadeOut(); 
     $('.next-question').css('opacity',0); 
    } 

    if($('.moreAnswers .selected').length === 3){ 
     $('.next-question').fadeIn(); 
     $('.next-question').css('opacity',1); 
    } else { 
     $('.next-question').fadeOut(); 
     $('.next-question').css('opacity',0); 
    } 

}); 

Answer 1

作業を取得するために苦労：

$('.answer').on('click',function(e){ 
    e.preventDefault(); 

    var selected = $('.moreAnswers > .selected').length; 

    if(selected == 3){ //if selected is 3 we focus on just deselecting 
     if($(this).is('.selected')){ //deselcted and remove links 
     $(this).removeClass('selected'); 
     $('.next-question').fadeOut(); 
      $('.next-question').css('opacity',0); 
     } 
    }else{ //toggle and check if this was the 3rd one 
     if($(this).is('.selected')){ 
      $(this).removeClass('selected'); 
     } else { 
      $(this).addClass('selected'); 
      if(selected == 2){ 
      $('.next-question').fadeIn(); 
      $('.next-question').css('opacity',1); 
     } 
      } 
    } 
}); 

サンプルFIDDLE