本文介绍如何使用 php 和 html 表单，让用户自定义表格行数、列数、边框及每个单元格的宽度和高度，并安全生成对应表格。代码简洁可运行，同时修正了原始代码中的属性名错误与潜在安全隐患。
本文介绍如何使用 php 和 html 表单，让用户自定义表格行数、列数、边框及每个单元格的宽度和高度，并安全生成对应表格。代码简洁可运行，同时修正了原始代码中的属性名错误与潜在安全隐患。
在 Web 开发中，动态生成 HTML 表格是常见需求。本教程以“用户输入控制单元格尺寸”为核心，提供一个轻量、可靠、即用型的 PHP 示例。
首先，需修正表单中两个关键输入字段的 name 属性（原代码误写为 nom）：
Largeur de Colonnes: <input type="text" name="widh"> Longueur de Colonnes: <input type="text" name="heig">
完整可运行的整合代码如下（含基础验证与输出转义建议）：
<form method="POST">
Nombre de Lignes: <input type="number" name="lign" min="1" value="3" required><br>
Taille de Bordure: <input type="number" name="border" min="0" value="1" required><br>
Nombre de Colonnes: <input type="number" name="ncol" min="1" value="4" required><br>
Largeur de Colonnes (px): <input type="number" name="widh" min="20" value="80" required><br>
Hauteur de Colonnes (px): <input type="number" name="heig" min="20" value="40" required><br>
<input type="submit" value="Générer le tableau">
</form>
<?php
if ($_SERVER["REQUEST_METHOD"] === "POST") {
// 输入过滤：仅允许数字，防止 XSS 和非法值
$l = filter_input(INPUT_POST, 'lign', FILTER_VALIDATE_INT) ?: 3;
$b = filter_input(INPUT_POST, 'border', FILTER_VALIDATE_INT) ?: 1;
$c = filter_input(INPUT_POST, 'ncol', FILTER_VALIDATE_INT) ?: 4;
$widh = filter_input(INPUT_POST, 'widh', FILTER_VALIDATE_INT) ?: 80;
$heig = filter_input(INPUT_POST, 'heig', FILTER_VALIDATE_INT) ?: 40;
// 安全输出：对属性值做 HTML 属性转义（虽为数字，仍推荐防御性处理）
$b = htmlspecialchars($b, ENT_QUOTES, 'UTF-8');
$widh = htmlspecialchars($widh, ENT_QUOTES, 'UTF-8');
$heig = htmlspecialchars($heig, ENT_QUOTES, 'UTF-8');
echo "<table border='$b' cellspacing='0' style='border-collapse: collapse; margin-top: 1em;'>\n";
for ($i = 1; $i <= $l; $i++) {
echo " <tr>\n";
for ($j = 1; $j <= $c; $j++) {
echo " <td width='$widh' height='$heig' style='border: 1px solid #ccc; text-align: center; vertical-align: middle;'> </td>\n";
}
echo " </tr>\n";
}
echo "</table>";
}
?>✅ 关键改进说明：
立即学习“PHP免费学习笔记（深入）”；
- 使用 <input type="number"> 替代 type="text"，提升用户体验与数据合法性；
- 添加 min 和 required 属性，约束输入范围并防止空提交；
- 采用 filter_input() 进行类型校验，无效值自动回退默认值；
- 单元格内添加 style（如 border, text-align, vertical-align），确保视觉一致性；
- cellspacing="0" 配合 style="border-collapse: collapse" 消除传统表格间隙，更符合现代布局习惯。
⚠️ 注意事项：
- width 和 height 属性在 HTML5 中已不推荐使用（属过时表现层属性），建议改用 CSS 控制（例如 <td style="width: <?php echo $widh; ?>px; height: <?php echo $heig; ?>px;">）。本例保留原逻辑以便兼容理解，但生产环境请优先使用 CSS；
- 若需支持响应式或复杂样式，应将尺寸存入 CSS 类或 <style> 块中，而非内联属性；
- 对用户输入始终执行过滤与转义，避免 XSS 风险——即使预期为数字，也应防范恶意构造（如 80" onclick="alert(1)"）。
掌握此模式后，你可轻松扩展功能：例如增加背景色选择、内容填充、导出为 CSV 等，让动态表格真正服务于业务场景。
