通过 ACF 从 WordPress 中的重复字段获取 Brightcove 视频

Question

我通过 ACF 重复字段在 WordPress 站点中有一个重复字段：

      <?php
      if( have_rows('recent_episodes') ):
        $i = 1;
          while ( have_rows('recent_episodes') ) : the_row();

        $image = get_sub_field('video_image');
      ?>

      <!--API CODE HERE-->

        <li class="recent-episode-<?php the_sub_field('brightcove_video_id'); ?> col-md-3 col-sm-4">
          <a href="#">
            <img src="<?php echo $image['url']; ?>" alt="<?php echo $image['alt']; ?>">
            <div class="flex-caption">
              <h6 class="date"><?php the_sub_field('air_date') ?></h6>
              <h5 class="title"></h5>
            </div>
          </a>
        </li>
      <?php
      $i++;
      endwhile; else :
      endif;
      ?>

brightcove_video_id 字段是 Brightcove 中视频的视频 ID。理想情况下，我想在重复字段中为每个视频添加相应的标题。但是，当我将 API 代码放在重复区域时，它每次只输出最后一项。这是我的 API 代码：

          var token = "HIDDEN";

          var req = "http://api.brightcove.com/services/library?"
          req += "command=find_video_by_id&token=" + encodeURIComponent(token);
          req += "&video_id=" + videoID;
          req += "&video_fields=id%2Cname%2CshortDescription%2CreferenceId&media_delivery=default//";
          req += "&callback=response";

          // Create a new request object
          bObj = new JSONscriptRequest(req);
          // Build the dynamic script tag
          bObj.buildScriptTag();
          // Add the script tag to the page
          bObj.addScriptTag();

        function response(jsonData) {
          jQuery('li.recent-episode-' + videoID ).find('h5').html(jsonData.name);
        }

我也尝试过使用 each 函数，但无济于事。我确定我只是在 Javascript 中遗漏了一些东西，但你可以使用一些帮助来解决它。

谢谢！

Answer 1

您函数中 videoID 的作用域是全局的。每次迭代脚本时都会更新它的值。当回调被触发（异步）时，它已经循环并且 videoID 具有您上次设置的最后一个值。

由于从 API 返回的 JSON 包含 id，最简单的方法就是使用它：

function response(jsonData) {
  jQuery('li.recent-episode-' + jsonData.id ).find('h5').html(jsonData.name);
}

通过 ACF 从 WordPress 中的重复字段获取 Brightcove 视频

Get Brightcove Videos from repeating field in WordPress via ACF

javascript

php

wordpress

brightcove

advanced-custom-fields