PHP遍历MySQL结果数组显示图片和MP4 仅图片可展示问题求助

代码存在的4个核心问题 #

• 循环逻辑错误：do-while 会先执行循环体代码，再判断条件拉取下一行记录。第一次进入循环时$row_signage还没有被赋值，导致首次读取FileType字段的值为空，自然匹配不到FileType=2的分支，首条为MP4时直接无法展示。如果查询结果为空还会额外触发不存在索引的报错。
• 变量名混用错误：代码中同时出现$row_signage和$row两个不同的记录变量，判断DisplayType、读取视频文件名时用的是不存在的$row，导致视频分辨率参数错误、视频文件地址无效，自然无法播放。
• 标签未闭合：FileType=2的分支中开启了<div id="video_player">但没有对应闭合标签，会导致页面DOM结构错乱，后续内容渲染异常。
• 变量名拼写错误：分辨率变量$DisplayWdith拼写错误，少了字母i，正确应为$DisplayWidth，如果其他位置引用该参数也会触发异常。

修复方案 #

1. 把do-while改为常规的while循环，先拉取记录再执行循环体
2. 统一所有记录读取的变量名为$row_signage
3. 补全video分支的div闭合标签
4. 修正分辨率变量拼写，给video的source标签添加type属性，避免浏览器识别视频格式出错

修正后完整代码 #

<?php
// 需确保已提前执行mysqli查询拿到结果集$fb
while ($row_signage = mysqli_fetch_array($fb)):
    $FileType = $row_signage['FileType'];
    if($row_signage['DisplayType'] == "P" ) {
        $DisplayWidth = "1080";
        $DisplayHeight = "1920";
    } else {
        $DisplayWidth = "1920";
        $DisplayHeight = "1080";
    }
?>
<div>
    <?php if($FileType == 1): ?>
        <img src="/<?= $ImagePath . $row_signage['SignageImageName'] ?>" class="responsive"/>
    <?php elseif($FileType == 2): ?>
        <div id="video_player">
            <video width="<?= $DisplayWidth ?>" height="<?= $DisplayHeight ?>" autoplay muted playsinline>
                <source src="/<?= $ImagePath . $row_signage['SignageImageName'] ?>" type="video/mp4">
            </video>
        </div>
    <?php endif; ?>
</div>
<?php endwhile; ?>

内容的提问来源于stack exchange，提问作者DCJones