只有 1 个 div 切换状态 jQuery（关闭其他）

Question

我目前正在使用 fadeToggle 来显示/隐藏某些元素，我在这里得到的似乎做得很好！当单击 li 元素内的 span 元素时，它会淡出切换 li 元素内的下一个 div。我想说非常漂亮！

<script type="text/javascript">
    $(document).ready(function () {
        $('.toggle_hide').hide();

        $("#background_absolute_content li span").css('cursor', 'pointer').click(function(){
            $(this).next("div").fadeToggle(200);
        });
    });
</script>

但是，当然总有一些你似乎无法弄清楚的事情！

我只想切换一个 div，目前它们在下一个跨度之后不会关闭，你可以在这里看到网站。如果您点击“现在兼容”行旁边的 linkedin 和 Facebook 图标，您就会明白我的意思。

那么有没有办法在单击下一个跨度时关闭 div。

注意，我也在右上角的配置图标上使用此方法。

Answer 1

我从来都不喜欢切换命令。我通常手动淡出/淡入...

<script type="text/javascript">
    $(document).ready(function () {
        $('.toggle_hide').hide();

        $("#background_absolute_content li span").css('cursor', 'pointer').click(function(){
            var $this = $(this);
            $('.toggle_hide').fadeOut(200, function(){ 
                $this.next("div").fadeIn(200);
            });
        });
    });
</script>

Answer 2

假设一种快速而肮脏的修复方法是在显示与单击的内容相关的方法之前调用您的 hide 方法。 插入您的方法：

$('.toggle_hide').hide();

在调用之前

$(this).next("div").fadeToggle(200);