jquery如果所有複選框選中show（）... else hide（）

Question

我有3個複選框和2個div。我希望能夠在所有3個複選框被勾選時顯示一個div，並且在勾選任何其他複選框組合時顯示另一個div（即不是全部3）。 如果有人能幫助我一些建議，我將非常感激。提前致謝。

<input id="1" type="checkbox" /> 
<input id="2" type="checkbox" /> 
<input id="3" type="checkbox" /> 

<div id="checked1">Title</div> 

<div id="checked2" style="display:none;"><span style="color:green;">Title</span></div> 


$(document).ready(function() { 

$(('input#1')&&('input#2')&&('input#3')).change(
    function() { 
     if ($(this).is(':checked')) { 
      $("#checked2").show(); 
      $("#checked1").hide(); 

     } else { 
       $("#checked1").show(); 
      $("#checked2").hide(); 
      } 
    }); 
}); 

Answer 1

var $cBoxes = $('#1,#2,#3'); 

$cBoxes.change(function(){ 
    // check if all are checked based on if the number of checkboxes total 
    // is equal to the number of checkboxes checked 
    if ($cBoxes.length == $cBoxes.filter(':checked').length){ 
    $('#checked2').show(); 
    $('#checked1').hide(); 
    }else{ 
    $('#checked2').hide(); 
    $('#checked1').show(); 
    } 
}); 

類似的東西？

Answer 2

你不能有ID開始或只是數字。試試這個

<input id="chk1" type="checkbox" /> 
    <input id="chk2" type="checkbox" /> 
    <input id="chk3" type="checkbox" /> 





var chkBoxes = $('#chk1,#chk2,#chk3'); 

     chkBoxes .change(function(){ 

     if (chkBoxes.filter(':checked').length == chkBoxes.length){ 
     $('#checked2').show(); 
     $('#checked1').hide(); 
     }else{ 
     $('#checked2').hide(); 
     $('#checked1').show(); 
     } 
    }); 

Answer 3

$(':input[type="checkbox"]').change(function() { 

    var checked = true; // assume checked 

    $(':input[type="checkbox"]').each(function() { 
     if (!this.checked) { 
      checked = false; // set false if any are unchecked, exit loop 
      return false; 
     } 
    }); 

    if (checked) { 
     $('#checked2').show(); 
     $('#checked1').hide(); 
    } else { 
     $('#checked1').show(); 
     $('#checked2').hide(); 
    } 
});