高级自定义字段数据不显示在Wordpress的花式框

我使用Wordpress中的高级自定义字段插件将带有链接的图像(也用于添加自定义视频播放器的嵌入代码)输出到存档页面上的帖子中。自定义字段的输出代码放在一个div中，该div是隐藏的，然后在单击.watchsession链接时加载到fancybox中。问题是，在调用时，ACF内容不会在fancybox中加载。如果我把代码放在隐藏div之外，它就会显示。不知道我哪里出错了。下面的代码!

欢呼,

<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>    
<a id="fancybox-button" href="#fancybox-content" class="watchsession" title="<?php the_title(); ?>">Watch</a>
<div style="display: none;">
   <div id="fancybox-content" style="width:600px; height:400px;overflow: hidden;">
   <img src="<?php the_field('upload_screenshot'); ?>"/>
   </div>
</div>
</article>
<script type="text/javascript">
                    ( function($) {
$(document).ready(function() {
    $("#fancybox-button").fancybox({
helpers : {
        title : {
            type: 'inside',
            position : 'top'
        }
    },
        'transitionIn'  : 'elastic',
        'transitionOut' : 'elastic',
    });
});
    } ) ( jQuery );
</script>