jquery - 根据多个复选框切换 div 可见性

Question

我有多个复选框。检查其中任何一个都会使 div 可见。不选中它们将会隐藏 div。感谢 Nick (http://stackoverflow.com/questions/4337378/toggle-div-based-on-checkbox-value)，它几乎可以工作，只是我想要多个复选框来切换 div。

HTML:

<div id="somediv">
<input type="checkbox" class="form-checkbox" value="a" name="a">
<input type="checkbox" class="form-checkbox" value="b" name="b">
<input type="checkbox" class="form-checkbox" value="c" name="c">
<input type="checkbox" class="form-checkbox" value="d" name="d">
</div>

<div id="tog">tog content</div>

jQuery:

        var tog = $("#tog").hide();
        $('#somediv .form-checkbox').change(function() {              
          if ($(tog).css('display') == 'none') {
            tog.show();
          }       
        });

另一个:

        var tog = $("#tog").hide();
        $('#somediv .form-checkbox').change(function () {                
            $(tog).toggle(this.checked);
        }).change();

我错过了什么？问题是取消选中其中之一(不是全部)会隐藏 div。要求是只有在没有检查的情况下才隐藏。并且默认隐藏。如果选中任何一个，请使其保持可见，不要切换。

任何提示将不胜感激。谢谢

Answer 1

尝试 -

var tog = $("#tog").hide();
 $('#somediv .form-checkbox').change(function () {                
   $(tog).toggle($('.form-checkbox:checked').length > 0);
 }).change();

演示 - http://jsfiddle.net/VA4NP/

这与您的第二个代码示例非常相似。它使用 $('.form-checkbox:checked').length > 0 作为传递给切换函数的参数，如果选中任何复选框，该函数应返回 true。