如何查询MySQL表tp12/tp13/tp14 LED亮灯时间戳并通过AJAX获取

1. 后端PHP（plate.php）调整 #

调整核心是用UNION ALL拼接三个列的首条点亮查询，同时新增标识字段区分不同tp列的查询结果，方便前端处理。调整后代码如下：

<?php
// 请保留你原有数据库连接逻辑，此处省略连接代码
// 下方tp13、tp14对应的匹配规则请替换为你实际的LED点亮状态标识
$query = "
SELECT 'tp12' AS tp_type, id, dateandtime FROM plate WHERE tp12 REGEXP 'L13_ON' ORDER BY id ASC LIMIT 1
UNION ALL
SELECT 'tp13' AS tp_type, id, dateandtime FROM plate WHERE tp13 REGEXP '替换为tp13对应点亮状态' ORDER BY id ASC LIMIT 1
UNION ALL
SELECT 'tp14' AS tp_type, id, dateandtime FROM plate WHERE tp14 REGEXP '替换为tp14对应点亮状态' ORDER BY id ASC LIMIT 1
";

$result = $mysqli->query($query);
$data = [];
foreach ($result as $row) {
    $data[] = $row;
}
$result->close();
$mysqli->close();
echo json_encode($data);
?>

2. 前端页面结构调整 #

首先在页面中新增三个对应显示区域，用于展示不同tp列的LED点亮时长：

<p>TP12点亮时长：<span id="tp12_time"></span></p>
<p>TP13点亮时长：<span id="tp13_time"></span></p>
<p>TP14点亮时长：<span id="tp14_time"></span></p>

3. 前端AJAX代码调整 #

调整核心是根据返回的tp_type字段将时长渲染到对应区域，同时优化定时请求的执行逻辑，避免重复执行DOM ready检测：

// 页面加载完成后再启动定时请求
$(document).ready(function () {
    // 每6秒请求一次数据
    setInterval(function(){
        $.ajax({
            url: "plate.php",
            method: "GET",
            dataType: "JSON",
            success: function (data) {
                var timeEnd = new Date();
                for (var i in data) {
                    var item = data[i];
                    var timestam = new Date(item.dateandtime);
                    var diff = (timeEnd - timestam) / 60000;
                    var minutes = Math.floor(diff % 60);
                    var hours = Math.floor(diff / 60);
                    var timeStr = hours + ":" + minutes.toString().padStart(2, '0');
                    // 按查询类型赋值到对应显示元素
                    document.getElementById(item.tp_type + "_time").innerHTML = timeStr;
                }
            }
        });
    }, 6000);
});

内容的提问来源于stack exchange，提问作者qarn.ooz