Question

我是一个jQuery noob，似乎我一直都是，一直试图让这个简单的事情发挥作用。

我想要的是，选中此复选框后，使用display: none;隐藏div。

这是我正在弄乱的一个jFiddle例子。

感谢您提供任何帮助或其他解决方案:)

Answer 1

我同意karim如果您只需要隐藏/显示，请使用.toggle(bool)，如果您的示例已经简化并且您需要一个类，请使用.toggleClass("class", bool)，如下所示：

$(function(){
  $("#checkbox4").change(function() {
    $("#checkout-shipping-address").toggleClass("show-hide", this.checked)
  }).change();
});

You can test it out here，最后一次.change()调用是在首次加载页面时使状态匹配here's what I mean。

Answer 2

不需要show-hide课程。只需传递一个布尔值来切换，并使用triggerHandler设置div的初始状态，这样就可以触发绑定到元素的事件处理程序，而不会实际影响元素的状态：

$(document).ready(function() {
    $("#checkbox4").click(function() {
        $("#checkout-shipping-address").toggle(this.checked);
    }).triggerHandler('click');
});

演示：http://jsfiddle.net/nQnDG/3/

Answer 3

请尝试以下代码：

$(function(){
    $('#checkbox4').change(function() {
        $("#checkout-shipping-address").toggleClass("show-hide");
    });
});

您需要绑定change或click事件才能做出反应。

jQuery：如果选中复选框，则为toggleClass

3 个答案: