单击时的 setTimeout 和 scrollTop 动画在手风琴中不起作用

Question

我希望 active/expanded 手风琴项在单击时跳到顶部。由于手风琴尚未完成滑动打开或关闭导致偏移，因此该位置发生变化。

我了解到我需要将此函数包装在 setTimeout 中，以便在滑动动画完成后执行。到目前为止，这是我的代码

$('.accordion-title').on('click', function() {
var content = $(this).next();

$('.accordion-content').not(content).slideUp(400);
$('.accordion-title').not(this).removeClass('expanded');
$(this).toggleClass('expanded');
content.slideToggle(400);
        
$('html,body').animate({scrollTop: $(this).offset().top}, 100);

});

我已经尝试了下面的方法，但它会导致错误

setTimeout(function(){
$('html,body').animate({scrollTop: $(this).offset().top}, 100);
},400);

Here is my fiddle

Answer 1

你需要这个代码吗？

$('.accordion-title').on('click', function() {
    var content = $(this).next();

    $('.accordion-content').not(content).slideUp(400);
    $('.accordion-title').not(this).removeClass('expanded');
    $(this).toggleClass('expanded');
    
    var self = this;
    content.slideToggle(400, function(e) {
        $('html,body').animate({scrollTop: $(self).offset().top}, 100); 
    });
    
   

});

单击时的 setTimeout 和 scrollTop 动画在手风琴中不起作用

setTimeout and scrollTop animation on click not working in accordion

jquery

settimeout

scrolltop