Javascript 如何在第三方滑下动画后执行代码？

背景： 我正在使用JS创建可折叠div。单击具有可折叠标题类的div时，具有可折叠主体类的同级div上会出现向下滑动动画，显示可折叠主体的内容

我试图做到的是，当点击一个可折叠的标题时，浏览器应该滚动到该div的顶部，以便用户可以完全看到内容。我使用了一个点击事件，它在第一个可折叠文件上运行良好。但是，如果您有一个打开的可折叠文件，并单击另一个打开它，则它不会正确地滚动到单击的div的顶部（它将滚动到主体的中间，或者滚动到div顶部的上方）

点击功能的JS小提琴：

我可以通过编辑MaterializeJS本身来完成我想要做的事情。以下是编辑前该行的外观：

object.sides（'.collapsablebody'）.stop（true，false）。slideDown({
持续时间：350，
放松：“放松夸脱”，
队列：false，
完成：函数（）{
$（this.css（'height'，''）；
}
});初始化
.collapsable
时，您应该能够使用
onOpen
选项。传入打开手风琴时要执行的函数。函数将元素作为参数接收

$(document).ready(function() {
    $('.collapsible').collapsible({
        onOpen: function(el) {
            $('body').animate({scrollTop: el.offset().top },'slow');
        }
    });
});

你能对你的场景做一个简单的解释吗？仅仅从文本就有点难判断发生了什么。还有，你有没有尝试过保证你的执行顺序正确？我没有尝试过承诺，但我肯定会更多地研究它们。下面是我的一个JSFIDLE场景（带有错误的点击代码，您可以看到为什么需要修改动画）：哦，我甚至不知道这是一个选项。我现在就试试。不幸的是，这不起作用。打开可折叠文件时没有发生任何事情，控制台中也没有错误。谢谢你的想法！我做了一个密码笔，似乎工作正常。您使用的是什么版本的Materialize？很抱歉，我使用的是旧版本。我更新了materialize并执行了代码，但是如果您打开另一个可折叠文件而没有关闭另一个，它不会滚动到新打开的可折叠文件的顶部（例如：先打开“first”，然后打开“second”）。这完美地说明了我的问题。我想我已经找到了一种方法来解决这个问题，使用onClose，仍然在使用它。