本文介绍如何使用 HTML 表单收集用户输入的数据，并通过 PHP 代码将用户重定向到包含这些数据的子页面。通过修改表单提交方式和服务器端处理逻辑，可以轻松实现动态 URL 重定向，从而构建更加灵活和用户友好的 Web 应用。
HTML 表单
首先，我们需要创建一个 HTML 表单，该表单包含两个文本输入框和一个提交按钮。用户将在这些输入框中输入数据，然后点击提交按钮。
<form action="" method="POST"> <label for="first">第一个值:</label><br> <input type="text" id="first" name="first"><br><br> <label for="second">第二个值:</label><br> <input type="text" id="second" name="second"><br><br> <input type="submit" value="提交"> </form>
在这个表单中：
- action="" 表示提交到当前页面。 稍后我们将使用 PHP 处理表单提交。
- method="POST" 指定使用 POST 方法提交表单数据。
- input type="text" 创建文本输入框，name 属性用于在服务器端访问输入的值。
- input type="submit" 创建一个提交按钮。
PHP 处理重定向
接下来，我们需要使用 PHP 代码来处理表单提交，并将用户重定向到指定的子页面。将以下代码添加到 HTML 表单所在的页面顶部：
立即学习“前端免费学习笔记（深入）”；
<?php
if (isset($_POST['first'], $_POST['second'])) {
$firstValue = $_POST['first'];
$secondValue = $_POST['second'];
// 构建重定向 URL
$redirectURL = '/variant/' . $firstValue . '-' . $secondValue;
// 执行重定向
header('Location: ' . $redirectURL);
exit();
}
?>这段 PHP 代码的作用如下：
- 检查表单是否已提交： isset($_POST['first'], $_POST['second']) 检查 first 和 second 两个输入框的值是否已通过 POST 方法提交。
- 获取输入值： 如果表单已提交，则从 $_POST 数组中获取 first 和 second 的值，并将其存储在变量 $firstValue 和 $secondValue 中。
- 构建重定向 URL： 使用获取到的值构建重定向 URL。 在本例中，URL 的格式为 /variant/{firstValue}-{secondValue}。
- 执行重定向： 使用 header('Location: ' . $redirectURL) 函数将用户重定向到构建的 URL。
- exit()： 在重定向后立即调用 exit() 函数，以确保脚本停止执行，避免任何意外的输出。
注意事项：
- header() 函数必须在任何输出之前调用，包括 HTML 标记、空格或任何其他字符。 否则，重定向将无法正常工作。
- 为了安全起见，应对用户输入进行验证和清理，以防止恶意攻击，例如跨站脚本攻击（XSS）。
- 确保 /variant/ 路径是有效的，并且服务器配置正确以处理该路径上的请求。
示例：
如果用户在第一个输入框中输入 "red"，在第二个输入框中输入 "green"，然后点击提交按钮，则页面将重定向到 /variant/red-green。
总结：
通过结合 HTML 表单和 PHP 代码，可以轻松实现基于用户输入的动态 URL 重定向。 这种方法可以用于构建各种 Web 应用，例如产品筛选、搜索结果页面和自定义 URL 生成器。 记住始终验证和清理用户输入，以确保应用程序的安全性和可靠性。
