jQuery 滑入和滑出答案

【问题标题】：jQuery Slide in and outjQuery 滑入和滑出
【发布时间】：2011-08-04 09:21:06
【问题描述】：

我试图让一个 div 在单击时向下滑动，效果很好，但是当再次单击该按钮时，我想隐藏，可能是使用 slideUp()... 但是我不太清楚该怎么做...任何帮助将不胜感激...

var iJob = this;

this.init = function () {
    //Hook up My Page
    $("#open-mypage").one("click", iJob.onMyPageDisplayJquery);

    //Hook click event on all "mere om.."
    /*$('.more-jobs').one("click", iJob.onJobCategoryMoreInfoJquery);
    $('#more-wrapper .close').bind("click", iJob.onJobCategoryMoreHideJquery);*/

};

//Vis Min Side
this.onMyPageDisplayJquery = function (event) {
    event.preventDefault();
    //iJob.jobCategoryMoreHideJquery();

    $("#mypage-result").addClass("hidden");
    $("#mypage-li").removeClass("mypage-li").addClass("mypage-li-hover");

    $('#mypage-info').slideDown('fast', function () {
        // Load content with ajax
        return false; 
    });
};

如您所见，slideDown 工作正常，并且显示了 div - 但是再次单击该按钮它应该被隐藏...我已经尝试过这个，slideToggle()，但没有任何运气

//Vis Min Side
this.onMyPageDisplayJquery = function (event) {
    event.preventDefault();
    //iJob.jobCategoryMoreHideJquery();

    $("#mypage-result").addClass("hidden");
    $("#mypage-li").removeClass("mypage-li").addClass("mypage-li-hover");

    $('#mypage-info').slideToggle('fast', function () {
        ////Animation complete

    });     
};

【问题讨论】：

分享一些 HTML 代码以便我们测试它，我们不能在不知道标记的情况下提出解决方案。

标签： javascript jquery

【解决方案1】：

你看过JQueryUI Accordion吗？

我认为这可能已经满足您的需求了？

【讨论】：

不完全——我只有一个按钮，可以打开和关闭一个 div，而不是选项卡
你能把你目前拥有的东西放在 jsFiddle 上吗？
好的...比我预期的要多一点。我如何到达切换幻灯片的位置？
如果你点击 fx: Min side - 它会打开一个带有切换的 div功能，当再次单击 Min side 时，我希望 div 关闭....
这也适用于 jsfiddle 吗？我无法让它工作。您是否有机会清理您的 html，使其仅包含您希望我们测试的元素？

【解决方案2】：

slideToggle 应该可以工作。我建议这可能是因为你没有扭转你正在采取的其他行动......例如：

$("#mypage-result").addClass("hidden");
$("#mypage-li").removeClass("mypage-li").addClass("mypage-li-hover");

应该换成...

$("#mypage-result").removeClass("hidden");
$("#mypage-li").removeClass("mypage-li-hover").addClass("mypage-li");

...再次点击时。

【讨论】：

那行不通 - 也尝试删除这两行，但没有运气

【解决方案3】：

问题是您正在使用one 函数来绑定点击处理程序，该处理程序只会触发一次。将其更改为使用bind。

【讨论】：