如何收集HTML表单color picker数据并传递到PHP中使用

基础传值逻辑 #

你现有编写的HTML表单已经满足基础传值要求：color类型的input配置了name="favcolor"，表单设置了method="get"提交到example.php，用户选中颜色点击提交按钮后，浏览器会自动将选中的十六进制颜色值拼接到请求URL中，传递给PHP后端，不需要额外编写前端代码。

PHP端取值&校验方法 #

在example.php中通过$_GET超全局变量即可获取参数，建议额外做格式校验，避免非法参数引发样式异常：

<?php
// 先设置默认颜色，避免参数缺失时报错
$user_selected_color = '#212121';
// 判断参数存在且符合6位十六进制颜色格式
if (isset($_GET['favcolor']) && preg_match('/^#[0-9a-fA-F]{6}$/', $_GET['favcolor'])) {
    $user_selected_color = $_GET['favcolor'];
}
?>

颜色值应用示例 #

拿到校验后的颜色值后，直接嵌入样式代码即可生效，比如给文本设置对应颜色：

<p style="color: <?php echo htmlspecialchars($user_selected_color); ?>">这段文字会显示用户选中的颜色</p>

可选优化方案 #

• 如果不想把颜色参数暴露在URL中，可以把表单的method属性修改为post，PHP端对应改为$_POST['favcolor']接收参数即可，校验逻辑完全一致
• 如果需要跨页面复用该颜色值，可以把校验后的颜色值存入$_SESSION、Cookie或者数据库，后续业务场景直接调用即可

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