如何在PHP邮件脚本中提交下拉选框的class而非value值

我希望表单提交下拉选项的class名称或显示文本，而非value值——value值要在页面其他地方用来调取价格，但邮件里需要包含下拉选框的class或文本。

我的表单代码如下：

<form method="post" id="my-form" action="emailscript.php" form enctype="multipart/form-data">
    <select name="signMaterial" id="signMaterial" class="signMaterial" onchange="updateSignMaterial(); updateSignMaterialClass();">
        <option value="111" class="Black-Riven-Slate" >Slate - Italian Black (Riven)</option>
        <option value="222" class="Black-Honed-Slate" >Slate - Italian Black (Honed)</option>
        <option value="333" class="Black-Polished-Granite" >Granite - Black Polished</option>
        <option value="444" class="Green-Honed-Slate" >Green Hones Slate</option>
    </select>
</form>

邮件脚本代码：

$signMaterial = $_POST['signMaterial'];
$message .= "<tr><td><strong>Sign Material:</strong></td><td>".$signMaterial."</td></tr>";

我尝试过用data-class但没效果：

$signMaterialClass = $_POST['signMaterial']['data-class'];

请问这种需求可行吗？

方法一：JavaScript+隐藏字段提交目标值 #

这种方法适合需要实时同步选中选项的class或文本的场景：

1. 在表单内添加两个隐藏输入框，分别存储选中选项的显示文本和class：

<input type="hidden" name="signMaterialText" id="signMaterialText">
<input type="hidden" name="signMaterialClass" id="signMaterialClass">

2. 完善updateSignMaterialClass()函数，切换选项时更新隐藏字段的值：

function updateSignMaterialClass() {
    const selectEl = document.getElementById('signMaterial');
    const selectedOption = selectEl.options[selectEl.selectedIndex];
    // 同步显示文本到隐藏字段
    document.getElementById('signMaterialText').value = selectedOption.textContent;
    // 同步class到隐藏字段
    document.getElementById('signMaterialClass').value = selectedOption.className;
}

3. 页面加载时初始化隐藏字段，避免用户未切换选项直接提交：

window.addEventListener('load', updateSignMaterialClass);

4. 在PHP脚本中直接获取隐藏字段的值：

$signMaterialText = $_POST['signMaterialText'];
$signMaterialClass = $_POST['signMaterialClass'];

// 插入邮件内容
$message .= "<tr><td><strong>Sign Material:</strong></td><td>".$signMaterialText."</td></tr>";
$message .= "<tr><td><strong>Material Class:</strong></td><td>".$signMaterialClass."</td></tr>";

方法二：PHP端通过value映射对应值 #

如果不想依赖JavaScript，可在PHP中建立value与class、文本的映射关系：

// 定义value对应的class和文本映射数组
$materialMap = [
    '111' => ['class' => 'Black-Riven-Slate', 'text' => 'Slate - Italian Black (Riven)'],
    '222' => ['class' => 'Black-Honed-Slate', 'text' => 'Slate - Italian Black (Honed)'],
    '333' => ['class' => 'Black-Polished-Granite', 'text' => 'Granite - Black Polished'],
    '444' => ['class' => 'Green-Honed-Slate', 'text' => 'Green Hones Slate']
];

$selectedValue = $_POST['signMaterial'];
// 校验选中值的有效性
if(isset($materialMap[$selectedValue])){
    $signMaterialText = $materialMap[$selectedValue]['text'];
    $signMaterialClass = $materialMap[$selectedValue]['class'];
} else {
    $signMaterialText = '未选择有效材质';
    $signMaterialClass = '';
}

// 拼接邮件内容
$message .= "<tr><td><strong>Sign Material:</strong></td><td>".$signMaterialText."</td></tr>";
$message .= "<tr><td><strong>Material Class:</strong></td><td>".$signMaterialClass."</td></tr>";

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