單擊文本框中的復選框，獲取復選框的計數和值，如果未選中，則應刪除該值，並應減少文本框中的計數

Question

下面是html代碼，我想在id ='selchk'的文本框中獲取用逗號分隔的復選框的值，並在id ='getcnt'的文本框中獲取單擊的復選框的計數，並在未選中的情況下應刪除該值並應該使用jquery減少計數。我已經嘗試過但沒有達到結果。需要幫助

<input type='checkbox' class='chk' value='1'>        
<input type='checkbox' class='chk' value='2'>       
<input type='checkbox' class='chk' value='3'>        
<input type='checkbox' class='chk' value='4'>        
<input type='checkbox' class='chk' value='5'>        
<input type='checkbox' class='chk' value='6'>           
<input type='text' class='getcnt' id='getcnt'>        
<input type='text' class='selchk' id='selchk'>

Answer 1

JsFiddle

var total = 0;

$（“。chk”）。click（function（）{

  var output = $.map($('.chk:checked'), function(n, i){ return n.value; }).join(','); total = $('.chk:checked').length; $("#getcnt").val(total); $("#selchk").val(output); }); 

JsFiddle

Answer 2

CodePen示例

var $boxes = $('input[type=checkbox]'),
    $count = $('#getcnt'),
    $values = $('#selchk');

$boxes.click(function() {
    var values = [];
    var checked =0;
    $boxes.each(function() {
      if (this.checked) {
        values.push(this.value);
        checked++;
      }
    });
    $count.attr('value',checked);
    $values.attr('value',values.toString());
});