javascript - JQuery 滑动和淡出 'not working' ?

标签 javascript jquery fadeout slideup

所以在我的 Javascript 中,我有这个

$('ul li').click(function(){ //loops through all <li>'s inside a <ul>

    $('ul .clicked').removeClass('clicked'); // when an <li> is clicked, remove .clicked class from any other <li>'s
    $(this).addClass('clicked'); // add .clicked class to the clicked <li> ($(this))

    $(this).screenSlide();
});

现在,screenSlide函数是这样的

$.fn.screenSlide = function(){ // $(this) = aboutSectorNineteen (<li>'s id)

    var test = $('.current').attr('id'); //if an element with .current as it's class exists, let test be equal to that elements id
    test = "#" + test;
    $(test).slideUp(); // slide it up, hide it and remove the .current class from the <li> element
    $(test).hide();
    $(test).removeClass('current');
    var gettingShown = $(this).attr('id');
    gettingShown = "#" + gettingShown + "Slide";
    $(gettingShown).addClass('current'); // add the .current class to $(this) <li>
    $(gettingShown).slideDown();
};

现在,gettingShown 确实向上滑动,当我单击另一个 < li > 时,向上滑动的屏幕(gettingShown)确实隐藏,但它不向上滑动。这意味着

$(test).hide();

但是正在工作

$(test).slideUp();

不起作用,对吗?这是为什么?我也尝试将slideUp更改为fadeOut,但这仍然不起作用。我将 SlideDown 更改为 fadeIn 并且成功了。为什么 SlideUp 和 fadeOut 不起作用?难道是我使用不当?

最佳答案

slideUp()是异步的,向上滑动完成后隐藏元素。

应该是

$(test).slideUp(function () {
    $(this).removeClass('current');
});

关于javascript - JQuery 滑动和淡出 'not working' ?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19286689/

相关文章:

javascript - js 中的正则表达式 .replace()

javascript - 动态添加到 Canvas 的图像未加载 JAVASCRIPT

javascript - jQuery 验证只工作一次问题

javascript - "else if"在 jQuery 中不起作用?

jQuery 将类添加到 3 组中的中间元素

javascript - 发送键不会触发按键向上或按键按下

javascript - jQuery fadeIn() 应该只显示一个 div,正在显示多个 div

javascript - Jquery Validate - 类列表

jquery - 如何将前两个图像放在一列和其余两列上?

jQuery 回调不等待淡出