javascript - 使用不同的 anchor 滑动切换相同的元素

Question

我正在尝试使用不同的 anchor 切换 div。我已经设置了我的代码，div“内容”的内容根据单击的 anchor 而变化。我需要实现的是不必单击两次来切换“内容”div，因为每个 .block anchor 都使用相同的幻灯片切换。当第一个 block 已经打开后单击第二个 block 时，它现在会关闭内容 div。我希望它能够切换回关闭位置并再次打开。当第二个 block 已经打开时单击它时，它应该自行关闭。看起来很简单，但我无法理解它......

HTML:

<div id="thumbnails">
    <div title="thumb1" class="block">1</div>
    <div title="thumb2" class="block">2</div>
    <div title="thumb3" class="block">3</div>
</div>

<div id="content">
    <div id="contentblock"></div>
</div>

jQuery:

$(document).ready(function(){   
    $("#content").hide();
    $(".block").click(function() {
        $("#content").slideToggle("slow");
    });
});

Fiddle

Answer 1

将点击的对象保存到变量中，并检查它是否与当前对象(与先前点击的对象)匹配。

$(document).ready(function(){   
    $("#content").hide();
    var obj;
    $(".block").click(function() {
        $("#content").slideToggle("slow");
        if(obj!==this)
            $("#content").slideDown("slow");

        obj=this;
    });
});

Fiddle