完成slideDown后，jQuery获取元素高度

Question

为什么在slideDown动画完成后我无法获得元素的高度？ 简单的例子：

var height;
el.slideDown('slow', function() {
    height = $(this).outerHeight();
});
console.log(height);

相反，控制台返回undefined值。这是jsfiddle的现场直播，我希望得到一些澄清，因为我正在努力学习。谢谢！ ：）

Answer 1

回叫的执行时间比console.log电话晚约600毫秒。当您调用log函数时，height变量仍保留undefined值。

Answer 2

尝试this小提琴

$('ul').on('click', '> li > a', function (e) {
    var _this = $(this).parent(),
        el = _this.children('p'),
        opened = _this.siblings('.open');

    opened
        .removeClass('open')
        .slideUp('slow');

    if (el.is(':visible')) {
        el.slideUp(300, 'easeInBack');
        _this.removeClass('open');
    } else {
        var height;
        el.slideDown('slow', function () {
            height = _this.outerHeight();
        }).promise().done(function() {
   alert(height)});

        _this.addClass('open');
    }

    e.preventDefault();
});