如何基于重复字段的下拉选择值为单个元素添加CSS类

看起来你遇到的问题是变量作用域导致的——你把$noimage定义在循环外面，只要有一个卡片的选择是"no"，这个变量就会被改成"no-image"，最后所有div都会共用这个值，自然所有元素都加上了类。咱们来调整一下代码逻辑，让每个卡片独立判断：

修正后的代码 #

<?php
$team_cards = get_field('team_cards');

// 先判断字段是否存在且有内容，避免空循环
if ($team_cards) {
    foreach ($team_cards as $item) {
        // 每次循环都初始化空类名，确保每个卡片独立判断
        $noimage = '';
        if ($item["yes_no"] == "no") {
            $noimage = "no-image";
        }
        // 在循环内部输出每个div，这样每个div用的是当前卡片对应的类名
        ?>
        <div class="<?php echo esc_attr($noimage); ?>"></div>
        <?php
    }
}
?>

关键调整点 #

• 把$noimage的初始化移到循环内部：这样每次遍历新的卡片时，都会重新开始判断，不会被上一个卡片的结果影响。
• 在循环内部输出div：确保每个div都对应当前循环的$item，类名只和当前卡片的选择绑定。
• 加上esc_attr()：这是WordPress开发的最佳实践，用来转义输出的类名，避免XSS安全问题。

如果你的yes/no选择是ACF的true/false字段（不是下拉选择），只需要把判断条件改成if (!$item["yes_no"])就可以了，逻辑是一样的。

备注：内容来源于stack exchange，提问作者yanksi_