jQuery ".length" +チェックボックスが混乱する

Question

フォームに「iCheck」というチェックボックスがあり、チェックボックスの数を確認する必要があります。 iCheckには、私がこれに使用するコールバック "ifChecked"と "ifUnchecked"（他のものの中で）があります。問題は次のとおりです。最初のチェックボックス（「Apple」）をチェックすると「0」が表示されます。「Apple」をもう一度クリックすると「1」が表示されるため、「length」機能で正しく作業することができませんその例では、どのようなアイデアをここにするか？

バックグラウンドは、最初に「バスケット」を隠してから、少なくとも1つまたは最大のバスケットの鶏を表示したいということです。 3フルーツチェック。ユーザが4つ以上の果物を選択すると、バスケットを再び隠したいと思う。

$('.my_cool_form input').on('ifChanged', function() { 
    if ($('.my_cool_form input[type="checkbox"]:checked').length < 3) { 
     $('.info').addClass('active'); 
    } 
    else{ 
     $('.info').removeClass('active'); 
    } 
}); 

Answer 1

これはあなたのために動作します：：ちょうど

ここ

は Codepen link

$('.my_cool_form input').on('ifChanged', function() { 
    if ($('.my_cool_form .checked').length == 0) { 
$('.info').addClass('active'); 
    } 
    if ($('.my_cool_form .checked').length == 3) { 
    $('.info').removeClass('active'); 
    } 
}); 

Answer 2

あなたは単に :checkedセレクタで、すべての確認のチェックボックスを確認することができます

ですを変更してください

// show checked elements 
$('input').on('ifChanged', function() {        
    var string = $('.my_cool_form input[type="checkbox"]:checked').length; 
    $('.jQuery_length_info span').text(string); 
}); 

から10私はまたload機能追加しました：私はあなたのcodepen で、それは私のためにうまく働いたすべてを、この試み負荷

上のチェックボックスをチェックする

$(window).on('load',function(){ 
    if ($('.my_cool_form input[type="checkbox"]:checked').length < 3) { 
     $('.info').addClass('active'); 
    } 
    else{ 
     $('.info').removeClass('active'); 
    } 

}); 

を。

あなたのために働いてcodepen、これはあなたにとって有益だったと思います。