带产品下拉列表的HTML表单如何无if-else提交数据到MySQL单表

方案核心思路 #

用配置映射表代替分支判断，所有产品类型的差异全部收敛到配置项，核心逻辑完全不需要if-else、switch语句，同时符合开闭原则，后续新增产品类型无需修改核心逻辑。 #

第一步：调整MySQL表结构 #

提供两种可选方案，推荐第一种JSON存储方式：

方案1（推荐）：JSON存专属属性（无冗余字段） #

执行SQL给products表新增2个字段，适配所有类型的专属属性，后续加新产品无需改表：

ALTER TABLE products 
ADD COLUMN `type` VARCHAR(20) NOT NULL COMMENT '产品类型标识',
ADD COLUMN `attr` JSON COMMENT '产品专属属性集合';

方案2（兼容低版本MySQL）：冗余字段存储 #

如果MySQL版本低于5.7不支持JSON，直接把所有专属字段加到表中即可：

ALTER TABLE products 
ADD COLUMN `type` VARCHAR(20) NOT NULL COMMENT '产品类型标识',
ADD COLUMN `size` INT DEFAULT NULL COMMENT 'DVD大小',
ADD COLUMN `weight` DECIMAL(10,2) DEFAULT NULL COMMENT '图书重量',
ADD COLUMN `height` DECIMAL(10,2) DEFAULT NULL COMMENT '家具高度',
ADD COLUMN `width` DECIMAL(10,2) DEFAULT NULL COMMENT '家具宽度',
ADD COLUMN `length` DECIMAL(10,2) DEFAULT NULL COMMENT '家具长度';

第二步：修改后端PHP处理逻辑 #

完全去掉分支判断，用关联数组做类型与字段的映射，同时改用预处理语句解决原代码的SQL注入风险：

<?php
$mysqli = new mysqli('localhost', 'root', '', 'things') or die(mysqli_error($mysqli));

if (isset($_POST['save'])) {
    // 提取通用基础字段
    $baseData = [
        'code' => $_POST['code'],
        'name' => $_POST['name'],
        'price' => $_POST['price'],
        'type' => $_POST['product-type']
    ];

    // 产品类型与专属字段的映射配置，新增产品仅需在这里加一行配置即可
    $typeFieldMap = [
        'dvd' => ['size'],
        'book' => ['weight'],
        'furniture' => ['height', 'width', 'length']
    ];

    // 直接根据提交的类型取对应专属字段，无匹配则取空数组
    $attrFields = $typeFieldMap[$_POST['product-type']] ?? [];
    $attrData = [];
    foreach ($attrFields as $field) {
        $attrData[$field] = $_POST[$field];
    }

    // ========== 对应JSON存储方案的插入逻辑（二选一即可） ==========
    $baseData['attr'] = json_encode($attrData, JSON_UNESCAPED_UNICODE);
    $stmt = $mysqli->prepare("INSERT INTO products (code, name, price, type, attr) VALUES (?, ?, ?, ?, ?)");
    $stmt->bind_param("ssiss", $baseData['code'], $baseData['name'], $baseData['price'], $baseData['type'], $baseData['attr']);

    // ========== 对应冗余字段存储方案的插入逻辑（二选一即可） ==========
    // $allData = array_merge($baseData, $attrData);
    // $fields = implode(',', array_keys($allData));
    // $placeholders = implode(',', array_fill(0, count($allData), '?'));
    // $stmt = $mysqli->prepare("INSERT INTO products ($fields) VALUES ($placeholders)");
    // $stmt->bind_param(str_repeat('s', count($allData)), ...array_values($allData));

    $stmt->execute() or die($stmt->error);
    $stmt->close();
    // 后续跳转、返回提示逻辑自行补充
}

第三步：前端优化（可选，避免无效字段提交） #

原代码中隐藏的输入框未禁用，会提交空值，修改showHide函数即可，同样无需分支判断：

function showHide() {
    const productType = document.getElementById('product-type').value;
    // 类型与对应专属字段容器的映射
    const typeContainerMap = {
        dvd: document.getElementById('size'),
        book: document.getElementById('weight'),
        furniture: [document.getElementById('height'), document.getElementById('width'), document.getElementById('length')]
    };
    // 先全部隐藏+禁用输入
    Object.values(typeContainerMap).flat().forEach(el => {
        el.style.display = 'none';
        el.querySelector('input').disabled = true;
    });
    // 显示当前类型对应字段+启用输入
    if (typeContainerMap[productType]) {
        [].concat(typeContainerMap[productType]).forEach(el => {
            el.style.display = 'block';
            el.querySelector('input').disabled = false;
        });
    }
}

方案优势 #

• 全程无if-else、switch分支判断，完全符合需求
• 扩展性极强，新增产品类型仅需修改前后端的映射配置，无需改动核心逻辑
• 用预处理语句彻底解决原代码的SQL注入安全问题
• JSON存储方案无需频繁调整表结构，表字段简洁无冗余

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