【问题标题】:Only 1 div toggle status jQuery (close others)只有 1 个 div 切换状态 jQuery(关闭其他)
【发布时间】:2011-08-20 01:38:21
【问题描述】:

我目前正在使用 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。

注意我在右上角的配置图标上也使用了这种方法。

【问题讨论】:

    标签: jquery toggle status


    【解决方案1】:

    我从来都不喜欢切换命令。我一般都是手动fadeOut/fadeIn...

    <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>
    

    【讨论】:

    • 不错。平滑过渡而不是 POOF,没有更多的 div。荣誉。 :)
    • 哈。不是我的问题,或者我会。 :D
    • 哇...也许我该睡觉了...明显累了...哈哈
    • 感谢(非常)快速的响应!我感觉有点不好,只是四处询问,但我一直在试图找出一个合适的解决方案。上面的例子工作得像 90%。问题是,当您在图标之间单击时,应该淡入的 div 会快速闪烁,因为您说先关闭它(希望这有意义)。我认为该解决方案与 .sibbling (或另一个选择器)有关,因为必须切换所有的 div 位于同一 ul 元素中的不同 li 元素中。 no-illusions.nl/projecten/friendchamp/backend.html
    • 我不确定我是否理解新问题...我还查看了该站点,它看起来不错...
    【解决方案2】:

    假设一个快速而肮脏的解决方法是在显示与单击的内容相关的方法之前调用您的 hide 方法。插入您的方法:

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

    打电话之前:

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

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2011-12-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多