You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

如何在自动合并同尺寸行的表格中,尺寸变更前添加表头行?

我来帮你搞定这个需求!核心思路是先跟踪尺寸的变化,每次尺寸切换时先输出表头,再处理对应尺寸的分组数据,同时保留你原来的rowspan逻辑。下面给你两种实现方式,看哪种更贴合你的代码结构:


方式一:先按尺寸分组(更清晰易维护)

这种方式先把相同尺寸的数据归为一组,处理起来逻辑更直观,也方便计算rowspan的数值:

// 假设你的原始产品数据数组是$products
$products = [
    ['name' => 'Shirt 1', 'size' => 'S', 'thickness' => '1.5mm', 'price' => '$8'],
    ['name' => 'Shirt 2', 'size' => 'S', 'thickness' => '2mm', 'price' => '$9'],
    ['name' => 'Shirt 3', 'size' => 'M', 'thickness' => '2mm', 'price' => '$10'],
    ['name' => 'Shirt 4', 'size' => 'M', 'thickness' => '2.5mm', 'price' => '$11'],
    ['name' => 'Shirt 5', 'size' => 'L', 'thickness' => '3mm', 'price' => '$13'],
];

// 第一步:按尺寸分组
$groupedBySize = [];
foreach ($products as $product) {
    $size = $product['size'];
    if (!isset($groupedBySize[$size])) {
        $groupedBySize[$size] = [];
    }
    $groupedBySize[$size][] = $product;
}

// 第二步:输出表格
echo '<table border="1" cellpadding="8" cellspacing="0">';

// 遍历每个尺寸组
foreach ($groupedBySize as $size => $items) {
    // 尺寸变化时,先输出表头行
    echo '<tr style="background-color: #f0f0f0;">';
    echo '<th>Name</th><th>Size</th><th>Thickness</th><th>Price</th>';
    echo '</tr>';
    
    $itemCount = count($items);
    $isFirstItem = true;
    
    foreach ($items as $item) {
        echo '<tr>';
        echo '<td>' . htmlspecialchars($item['name']) . '</td>';
        
        // 组内第一行输出带rowspan的尺寸,后续行跳过尺寸列
        if ($isFirstItem) {
            echo '<td rowspan="' . $itemCount . '">' . htmlspecialchars($size) . '</td>';
            $isFirstItem = false;
        }
        
        echo '<td>' . htmlspecialchars($item['thickness']) . '</td>';
        echo '<td>' . htmlspecialchars($item['price']) . '</td>';
        echo '</tr>';
    }
}

echo '</table>';

方式二:单次遍历+临时缓存(适合不想提前分组的场景)

如果你的数据已经按尺寸排序,也可以用一次遍历完成,通过临时变量缓存当前尺寸的所有条目:

$products = [
    // 同上的产品数据
];

// 先确保数据按尺寸排序(如果原数据没排序的话)
usort($products, function($a, $b) {
    return strcmp($a['size'], $b['size']);
});

echo '<table border="1" cellpadding="8" cellspacing="0">';

$currentSize = null;
$currentGroup = [];

foreach ($products as $index => $product) {
    // 遇到新尺寸,先输出缓存的上一组数据
    if ($product['size'] !== $currentSize && !empty($currentGroup)) {
        outputGroup($currentGroup);
        $currentGroup = [];
    }
    
    $currentSize = $product['size'];
    $currentGroup[] = $product;
    
    // 处理最后一组数据
    if ($index === count($products) - 1) {
        outputGroup($currentGroup);
    }
}

echo '</table>';

// 封装输出组的函数,避免重复代码
function outputGroup($group) {
    // 输出表头行
    echo '<tr style="background-color: #f0f0f0;">';
    echo '<th>Name</th><th>Size</th><th>Thickness</th><th>Price</th>';
    echo '</tr>';
    
    $count = count($group);
    $isFirst = true;
    foreach ($group as $item) {
        echo '<tr>';
        echo '<td>' . htmlspecialchars($item['name']) . '</td>';
        
        if ($isFirst) {
            echo '<td rowspan="' . $count . '">' . htmlspecialchars($item['size']) . '</td>';
            $isFirst = false;
        }
        
        echo '<td>' . htmlspecialchars($item['thickness']) . '</td>';
        echo '<td>' . htmlspecialchars($item['price']) . '</td>';
        echo '</tr>';
    }
}

关键注意点

  1. 数据排序:不管用哪种方式,都要确保原始数据是按size字段排序的,不然相同尺寸的条目会分散,导致表头重复输出错误。
  2. XSS防护:用htmlspecialchars()转义输出内容,避免用户输入的特殊字符破坏页面结构或引发安全问题。
  3. 样式优化:我给表头加了浅灰色背景,你可以根据需求调整样式,让不同尺寸区块的区分更明显。

内容的提问来源于stack exchange,提问作者KDJ

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.05.19 09:51:15