点击slidetoggle div但首先隐藏其他人 - jQuery

Question

我有一个页面,当用户点击标题时,以下div切换显示.

我想以某种方式说出是否显示任何其他div:块然后将它们设置为先显示无.

我有以下......

$('.office-title').click(function(){
     $(this).next('div').slideToggle();
     return false;
});

我的HTML标记就是这样......

<div class="office-row">
    <h3 class="office-title">Title</h3>
    <div class="office">sadasd</div>
</div>
<div class="office-row">
    <h3 class="office-title">Title</h3>
    <div class="office">sadasd</div>
</div>
<div class="office-row">
    <h3 class="office-title">Title</h3>
    <div class="office">sadasd</div>
</div>

Answer 1

</office>不是有效的结束.结束应该是</div>

<div class="office-row">
        <h3 class="office-title">Title</h3>
        <div class="office">sadasd</div>
      </div>
    <div class="office-row">
        <h3 class="office-title">Title</h3>
        <div class="office">sadasd</div>
    </div>
    <div class="office-row">
        <h3 class="office-title">Title</h3>
        <div class="office">sadasd</div>
    </div>

CSS:

.office
{
    display: none;
}

和jquery:

$(function () {
    $('.office-title').click(function () {
        $(this).next('div').slideToggle();

        $(this).parent().siblings().children().next().slideUp();
        return false;
    });
});

在这里你可以检查