javascript - 在 JQuery 中单击复选框时显示 Div

Question

这段代码似乎显示了一个 div，当选中该框时该 div 就会消失。

<script src="/js/jquery.js"></script>
<script type="text/javaScript">
    $(function() {
        $('input[type="checkbox"]').on('change', function() {
            $(this).closest('fieldset').find('.myClass').toggle(!this.checked);
        });
    });
</script>

<fieldset>
    <legend>Check Here<input type="checkbox"></legend>
    <span class="myClass">
        <p>This is the text.</p>
    </span>
</fieldset>

如何更改它以仅在选中时而不是在选中之前显示该框？

编辑:将其更改为 !this.checked/this.checked，不是解决方案。

Answer 1

您可以使用 this.checked 而不是 !this.checked。

$(function() {
     $('input[type="checkbox"]').on('change', function() {
         $(this).closest('fieldset').find('.myClass').toggle(this.checked);
     });
});

您还可以将 .myClass 设置为最初隐藏:

span.myClass {
    display:none;
}

jsFiddle here.