Jquery UI slideUp和slideDown

Question

我很忙，只需点击按钮即可显示和隐藏一些框。它运作良好，但我必须第一次点击2次我想隐藏一个盒子？

这是我的JS代码：

$(function() {
    $('.title .hide').showContent();
});

$.fn.showContent = function() {
    return this.each(function() {
        var box = $(this);
        var content = $(this).parent().next('.content');

        box.toggle(function() {
            content.slideDown(400);
        }, function() {
            content.slideUp(400);
        });

    });
}; 

和de HTML

<div class="box">
    <div class="title">
        Title
        <span class="hide"></span>
    </div>
    <div class="content">Content</div>
</div>

这是为什么？有人可以帮助我吗？

这是一个演示：http://jsfiddle.net/wq7PF/（点击黑色按钮。当你第一次点击它什么也没做，但第二次然后内容会崩溃。）

Answer 1

扭转你的职能

box.toggle(function() {
  content.slideUp(400);
}, function() {
  content.slideDown(400);
});