jQuery toggle()问题

Question

我使用了这个讨论中的一个脚本：https://wordpress.stackexchange.com/a/14711/14649

它工作得很好，但当我选择一个不同的无线输入时，原来的框不会关闭(坏的)，但新的框确实会出现(好的)。对于我添加的任何额外的框，都会发生这种情况。

jQuery不是我的强项，我一直在研究，但没有运气！下面是我的代码：

<script type='text/javascript'>
 jQuery(document).ready(function($) {
        $('#feature_box').hide();
        $('#standard_lead').hide();             

        // one box
        $('#value_feature_box').is(':checked') ? $("#feature_box").show() : $("#feature_box").hide();
        $('#value_feature_box').click(function() {
            $("#feature_box").toggle(this.checked);
        });

        // second box
        $('#value_standard_lead').is(':checked') ? $("#standard_lead").show() : $("#standard_lead").hide();
        $('#value_standard_lead').click(function() {
            $("#standard_lead").toggle(this.checked);
        });
    });
</script>

感谢您的关注！

Answer 1

另一个盒子没有消失的原因是因为你没有告诉它消失！

$('#value_feature_box').click(function() {
    $("#feature_box").toggle(this.checked);
});

这表示当您单击#value_feature_box时，切换#feature_box的可见性。如果#value_feature_box不是复选框，则将内部代码更改为$("#feature_box").toggle();。如果你也想让某些东西消失，那就告诉它：

$('#value_feature_box').click(function() {
    $("#feature_box").toggle();
    $("#standard_lead").toggle();
});

toggle()圆括号内的值告诉它是出现还是消失(true或false)。

Answer 2

您只需在单击时切换一个框-您需要同时切换两个框，请参阅此jsFiddle：

• http://jsfiddle.net/Gr8Jq/

使用这个(和另一个框类似)：

    $('#value_feature_box').click(function() {
        $("#feature_box").toggle(this.checked);
    });

您基本上是在说-单击时(因此this.checked将始终为true)，切换元素。从文档中：

• http://api.jquery.com/toggle/

您使用的是具有showOrHide参数的切换版本，并且始终传递true，因此始终只显示被单击的框。