Question

我试图让一个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

    });     
};

Answer 1

你看过JQueryUI Accordion吗？

我认为这可能会做你想要的吗？

Answer 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");

...再次点击时。

Answer 3

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

jQuery滑入和滑出

3 个答案: