在click click事件中添加for循环

时间:2016-12-29 06:47:43

标签: jquery

我有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%。我做错了什么?

2 个答案:

答案 0 :(得分: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);

    });             
 });

答案 1 :(得分:1)

据我说,这应该通过创建像

这样的其他数组来完成
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{

  }
        });

之前选择的答案将无法多次检查并取消选中正确的答案,它将增加百分比并且不会降低它。在这里找到Updated Jsfiddel