Добавление цикла для события click click

Question

У меня есть 5 флажков, когда я нажимаю каждый флажок, процентное отношение должно быть увеличено аналогичным образом, когда снимите флажок, процентная доля должна быть уменьшена.

$(document).ready(function(){ 
     var arr=['c','f','i','n','s']; 
     var n=6; 
      $("input").click(function(){ 
      if(this.checked){ 
      if($.inArray(this.value,arr)>-1){ 
       for(var count=1;count<n;count++) 
       { 

        var percentage=Math.ceil(count * (100/5)); 
        alert('your percentage is' + percentage); 
       } 
      }else{}} 
      }); 

}); 

Но он возвращает 100% за один клик. Что я делаю неправильно?

Answer 1

Вы можете проверить обновленной скрипку jsfiddle.net/x4bb87L4/3/

кодекса, обновленного

$(document).ready(function(){  
     var arr=['c','f','i','n','s']; 

     $("input").click(function(){ 
     $(this).siblings('input[type="checkbox"]').not(this).prop('checked', false).next().removeClass("fa-times cross fa-check tick"); 

     if(this.checked){ 
      if($.inArray(this.value,arr)>-1){             
       $(this).next().addClass("fa-check tick");   
      }else{               
       $(this).next().addClass("fa-times cross");   
      }     
     }else{ 
      $(this).next().removeClass("fa-check times tick cross"); 
     } 

     var correctAnswer=$(".fa-check.tick").length; 
     //var wrongAnswer=$(".fa-times.cross").length; 
     //var count=correctAnswer-wrongAnswer; 
     var count=correctAnswer; 
     count=count<0?0:count; 
     $('#value').html(count); 
     var percentage=Math.ceil(count * (100/5)); 
     percentage=percentage<0? 0 :percentage; 
     $('#percent').html(percentage); 

    });    
}); 

Answer 2

По мне это должно быть сделано путем создания другого массива как

var n=0; 
    var arrayforselection=[]; 
     $("input").click(function(){ 
     if(this.checked){ 

    if($.inArray(this.value,arrayforselection)<0){ 
    if($.inArray(this.value,arr)>-1){ 
    arrayforselection.push(this.value); 
    } 
    } 
    }else{ 

    if($.inArray(this.value,arrayforselection)>=0){ 
    if($.inArray(this.value,arr)>-1){ 
    arrayforselection.indexOf(this.value) 
    arrayforselection.splice(arrayforselection.indexOf(this.value),1); 
    } 
    } 
    } 
    n=arrayforselection.length; 
     if($.inArray(this.value,arr)>-1){ 
    if(n===0){ 
      $('#value').html(n) 
       var percentage=Math.ceil(n * (100/5)); 
       $('#percent').html(percentage) 

    } 
      for(var count=1;count<=n;count++) 
      { 
       $('#value').html(count) 
       var percentage=Math.ceil(count * (100/5)); 
       $('#percent').html(percentage) 
      } 
     }else{ 

    } 
     }); 

предыдущего выбранный ответ не будет работайте в вас несколько раз, проверяя и не проверяя правильный ответ, он увеличит процент и не уменьшит его. Найти шоу кода HTML Updated Jsfiddel здесь