Мои значения флажка вычисляются при снятии флажка вместо проверки

Question

Ниже приведен код. Я хочу рассчитать значение установленного флажка. Я хочу такую ​​функциональность, как: Когда я устанавливаю флажок «#selectall», он выбирает все флажки и вычисляет его значение. Но в этом коде он вычисляет значения при снятии флажка «#selectall». Как я могу исправить эту проблему?

$(document).ready(function() { 
 

 

 
    // Select all 
 
    $('#selecctall').click(function (event) { //on click 
 
     if (this.checked) { // check select status 
 
      $('.checkbox1').each(function() { //loop through each checkbox 
 
       this.checked = true; //select all checkboxes with class "checkbox1"    
 
      }); 
 
     } else { 
 
      $('.checkbox1').each(function() { //loop through each checkbox 
 
       this.checked = false; //deselect all checkboxes with class "checkbox1"      
 
      }); 
 
     } 
 
    }); 
 

 
}); 
 

 
//Addition for checked value 
 
$('input').click(function() { 
 
    var sum = 0; 
 
    $('input[type=checkbox]:checked').each(function() { 
 
     sum += Number($(this).val()); 
 
    }); 
 
    console.log(sum); 
 
    $("#sum").html(sum); 
 
}); 
 

 
//popover 
 
$(document).ready(function() { 
 
    $('.pop').popover({ 
 
     content: "Other Expenses 200 <br> Other Expenses 200 <br>Other Expenses 200 <br> ", 
 
     html: true, 
 
     placement: "right", 
 
     trigger: "focus" 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
 
<tr> 
 
     <td align="center">2</td> 
 
     <td align="center">2007/00006</td> 
 
     <td align="center">Yousef</td> 
 
     <td align="center">GR5/A</td> 
 
     <td align="right">0.000</td> 
 
     <td align="right">1000.000 
 
      <input type="checkbox" name="checkbox5" id="checkbox5" class="checkbox1" value="1000"> 
 
     </td> 
 
     <td align="right">1000.000 
 
      <input type="checkbox" name="checkbox8" id="checkbox8" class="checkbox1" value="1000"> 
 
     </td> 
 
     <td align="right">1000.000 
 
      <input type="checkbox" name="checkbox11" id="checkbox11" class="checkbox1" value="1000"> 
 
     </td> 
 
     <td align="right"><strong> 3000.000</strong> 
 

 
     </td> 
 
    </tr> 
 
    <tr> 
 
     <td align="center">3</td> 
 
     <td align="center">2012/00058</td> 
 
     <td align="center">Ghalia</td> 
 
     <td align="center">KG2/C</td> 
 
     <td align="right">0.000</td> 
 
     <td align="right">0700.000 
 
      <input type="checkbox" name="checkbox6" id="checkbox6" class="checkbox1" value="700"> 
 
     </td> 
 
     <td align="right">0700.000 
 
      <input type="checkbox" name="checkbox9" id="checkbox9" class="checkbox1" value="700"> 
 
     </td> 
 
     <td align="right">0700.000 
 
      <input type="checkbox" name="checkbox12" id="checkbox12" class="checkbox1" value="700"> 
 
     </td> 
 
     <td align="right"><strong> 2100.000</strong> 
 

 
     </td> 
 
    </tr> 
 
    <tr> 
 
     <td align="center" class="hide-xs">&nbsp;</td> 
 
     <td align="center" class="hide-xs">&nbsp;</td> 
 
     <td align="center" class="hide-xs">&nbsp;</td> 
 
     <td align="center" class="hide-xs">&nbsp;</td> 
 
     <td align="right" class="hide-xs">&nbsp;</td> 
 
     <td align="right" class="total"><strong>3100.000 
 
         <input type="checkbox" name="checkbox14" id="checkbox14" class="checkbox1" value="0"> 
 
         </strong> 
 

 
     </td> 
 
     <td align="right" class="total"><strong>3100.000 
 
         <input type="checkbox" name="checkbox15" id="checkbox15" class="checkbox1" value="0"> 
 
         </strong> 
 

 
     </td> 
 
     <td align="right" class="total"><strong>3100.000 
 
         <input type="checkbox" name="checkbox16" id="checkbox16" class="checkbox1" value="0"> 
 
         </strong> 
 

 
     </td> 
 
     <td align="right" class="total"><strong> 9300.000 
 
         <input type="checkbox" name="checkbox13" id="selecctall" value="0"> 
 
         </strong> 
 

 
     </td> 
 
    </tr>

Answer 1

Finally I found the problem it was because of I closed the $(document).ready(function() before the execution 

    $(document).ready(function() { 


     // Select all 
     $('#selecctall').click(function (event) { //on click 
      if (this.checked) { // check select status 
       $('.checkbox1').each(function() { //loop through each checkbox 
        this.checked = true; //select all checkboxes with class "checkbox1"    
       }); 
      } else { 
       $('.checkbox1').each(function() { //loop through each checkbox 
        this.checked = false; //deselect all checkboxes with class "checkbox1"      
       }); 
      } 
     }); 

    **** // actually i closed the function here this should be at the end 

    //Addition for checked value 
    $('input').click(function() { 
     var sum = 0; 
     $('input[type=checkbox]:checked').each(function() { 
      sum += Number($(this).val()); 
     }); 
     console.log(sum); 
     $("#sum").html(sum); 
    }); 

}); 

Answer 2

Я удалил это:

$(document).ready(function(){ 
    $('.pop').popover({content: "Other Expenses 200 <br> Other Expenses 200 <br>Other Expenses 200 <br> ", html: true, placement: "right", trigger: "focus"}); 
}); 

и копировать/вставить код в jsfiddle.net

Все, кажется, работает ... ИДК, где ваша проблема ... ваш код работает над проверкой & снимите отметку ...!

http://jsfiddle.net/sgvwczjq/1/