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();
    }
});

Jquery如果选中所有复选框show（）... else hide（）

3 个答案: