Jquery+GSAP访问onComplete函数的本地计算值

如何从触发onComplete的函数传递或更新变量及其值（当某个动画完成时）

整个操作发生在onClick功能内部，如下所示：

//Trigger animation on offer_button click
$offer_button.on('click', function (e) {
    //Vars:
    var $location = $(this).attr('href'),
        $dividerW = $('#divider').width(),
        $offer_headerW = $('#offer_header').width();

    e.preventDefault();
    $text_container.removeClass('reversing');
    //Nadajemy kontenerowi stan aktywny - KROK 1
    $text_container.addClass('playin');

    //display loader and then content function
    function completedFnc() {
        $content_wrapper.html('<div class="loader"><div class="uil-ring-css" style="transform:scale(0.51);"><div></div></div></div>');
        $content_wrapper.load($location + ' ' + '.ajax_content', function () {
            $content_wrapper.hide().fadeIn('slow');
            $content_wrapper.addClass('animation_complete');
            $('#ajax p').hyphenate('pl');
            $text_container.removeClass('playin');
        });
    }

    //place where animation, loader and content is called or not..
    if ($content_wrapper.hasClass('animation_complete')) {
        if ($(this).hasClass('data_retrieved')) {
            console.log('Content is already loaded. No need to refresh it.');
        }
        else {
            $offer_button.removeClass('data_retrieved'); //usuwamy klasę z poprzedniego przycisku
            $(this).addClass('data_retrieved');  //dodajemy klasę do ostatnio klikniętego przycisku
            completedFnc(); //wyświetlamy loader i wczytujemy treść (na końcu dodajemy klasę 'animation_complete')
            console.log('Animacja już wykonana, tylko ładujemy treści');
        }
    }
    else {

        //local vars
        var introduction = $('.introduction'),
            introductionH = introduction.outerHeight(),
            offer_containerH = $offer_text_container.outerHeight(),
            newWidth;

        function updateW() {
            //Calculate inner width for offer content
            var text_containerW = $text_container.width(),
                col1 = $('#offer_header').width(),
                col2 = $('#divider').width();
            newWidth = (text_containerW - col1 - col2 - 20) / text_containerW * 100;
        }

        console.log(newWidth);
        //Offer CSS calculating
        introduction.css({
            'height': introductionH + 'px'
        });
        $offer_text_container.css({
            'min-height': offer_containerH + 'px'
        });

        //Animation settings
        $anime = new TimelineMax({paused: true})
            .to('.button_row', 0.2, {opacity: 0})
            .to('.introduction', 0.4, {height: 0, autoAlpha: 0, display: 'none'})
            .to($text_container, 0.6, {
                transformPerspective: 1000, autoAlpha: 1, width: $value + 'px', onComplete: updateW
            }, 'now!')
            .to($image, 0.3, {opacity: 0, autoAlpha: 0}, 'now!')
            .to('.button_row a', 0.4, {marginTop: 0})
            .to('.button_row div.columns ', 0.4, {width: 12.5 + '%'})
            .to('.button_row', 0.4, {opacity: 1, delay: 0.2})
            .to($content_wrapper, .6, {css: {display: 'relative', minHeight: 200 + 'px'}})
            .to($switch, .6, {y: 35 + 'px', onComplete: completedFnc})
            .to('#offer_text', .4, {width: newWidth})
            .to($switch, .6, {
                opacity: 1,
                scale: 1,
                transformOrigin: "50% 50%",
                transformPerspective: 1000,
                autoAlpha: 1
            });

        $anime_small = new TimelineMax({paused: true})
            .to('.introduction', 0.4, {height: 0, autoAlpha: 0, display: 'none'})
            .to($content_wrapper, .6, {css: {display: 'relative', minHeight: 200 + 'px'}})
            .to($switch, .6, {y: 35 + 'px', onComplete: completedFnc})
            .to($switch, .6, {
                opacity: 1,
                scale: 1,
                transformOrigin: "50% 50%",
                transformPerspective: 1000,
                autoAlpha: 1
            });
        if ($(window).width() >= 641) {
            $anime.play();
        }
        else {
            $anime_small.play();
        }
        $offer_button.removeClass('data_retrieved');
        $(this).addClass('data_retrieved');
        //$text_container.removeClass('reversing');
    }
});

以下是我认为问题发生的地方：

else {

        //local vars
        var introduction = $('.introduction'),
            introductionH = introduction.outerHeight(),
            offer_containerH = $offer_text_container.outerHeight(),
            newWidth;

        function updateW() {
            //Calculate inner width for offer content
            var text_containerW = $text_container.width(),
                col1 = $('#offer_header').width(),
                col2 = $('#divider').width();
            newWidth = (text_containerW - col1 - col2 - 20) / text_containerW * 100;
        }

        console.log(newWidth);
        //Offer CSS calculating
        introduction.css({
            'height': introductionH + 'px'
        });
        $offer_text_container.css({
            'min-height': offer_containerH + 'px'
        });

        //Animation settings
        $anime = new TimelineMax({paused: true})
            .to('.button_row', 0.2, {opacity: 0})
            .to('.introduction', 0.4, {height: 0, autoAlpha: 0, display: 'none'})
            .to($text_container, 0.6, {
                transformPerspective: 1000, autoAlpha: 1, width: $value + 'px', onComplete: updateW
            }, 'now!')
            .to($image, 0.3, {opacity: 0, autoAlpha: 0}, 'now!')
            .to('.button_row a', 0.4, {marginTop: 0})
            .to('.button_row div.columns ', 0.4, {width: 12.5 + '%'})
            .to('.button_row', 0.4, {opacity: 1, delay: 0.2})
            .to($content_wrapper, .6, {css: {display: 'relative', minHeight: 200 + 'px'}})
            .to($switch, .6, {y: 35 + 'px', onComplete: completedFnc})
            .to('#offer_text', .4, {width: newWidth})
            .to($switch, .6, {
                opacity: 1,
                scale: 1,
                transformOrigin: "50% 50%",
                transformPerspective: 1000,
                autoAlpha: 1
            });

我将尝试简要解释上面的代码是如何工作的（或者我认为它是如何工作）。

当您单击按钮时（如果您不熟悉GSAP，则设置动画），容器的宽度从50%到大约90%。完成后，调用函数updateW；这个函数计算容器中带有文本的div的新宽度。

在开始动画之前，带有文本的div的宽度约为67%，当动画完成时，它应该更新到约84%（取决于从updateW检索到的值）。

尽管我尝试了几个小时的名称空间、全局变量、本地变量，但当它完成时，我无法从updateW传递newWidth值；它总是返回CCD_ 5。

我错过了什么？谢谢