从 ACF 转发器字段传递单个 PHP 值

Question

我有一个公司团队成员的页面。团队成员使用 ACF 转发器呈现，其中包含姓名、职务和传记字段。在页面上，我只想呈现他们的姓名和职位。如果您要单击某个团队成员，则会打开一个显示该团队成员传记的模式。

我有这个工作，但我的方法将传记字段添加到每个团队成员的 DOM，隐藏它，并在单击时将其传递到模态。我想知道是否可以将 Biography 字段传递到模式中，而不必最初在 DOM 中呈现文本并隐藏它？

下面是我当前的代码：

<!-- acf repeater -->
<?php if( have_rows('team_member') ): ?>
    <?php while( have_rows('team_member') ): the_row();
        $name = get_sub_field('name');
        $job_title = get_sub_field('job_title');
        $biography = get_sub_field('biography');

    ?>
        <div class="team-member">
            <div>
                <?php echo $name ?>
            </div>
            <div>
                <?php echo $job_title ?>
            </div>
            <div class="biography" style="display: none;">
                <?php echo $biography ?>
            </div>
        </div>
    <?php endwhile; ?>

    <!-- modal -->
    <div class="modal">
        modal
        <div class="modal-biography">

        </div>
    </div>
<?php endif; ?>

<!-- javascript -->
jQuery(function($) {
    $('.team-member').on('click', function() {
        var modalBiography = $(this).find('.biography').text();
        $('.modal-biography').text(modalBiography);
    })
});

Answer 1

如果您不需要显示简历 div，我建议您将其放入 data-bio 属性中：

<div class="team-member" data-bio="<?php echo $biography; ?>">
    <div><?php echo $name; ?></div>
    <div><?php echo $job_title; ?></div>
</div>

然后稍微调整一下 js 来拉这个 data-bio：

jQuery(function($) {
    $('.team-member').on('click', function() {
        var modalBiography = $(this).data('bio');
        $('.modal-biography').text(modalBiography);
    })
});

从 ACF 转发器字段传递单个 PHP 值

Pass single PHP value from ACF Repeater Field

javascript

php

advanced-custom-fields

acfpro