不使用input表单标签，PHP导航栏实现页面间POST传参的方法

核心说明：HTML原生<a>标签默认只能发起GET请求，没有直接触发POST请求的原生能力，下面的方案均可以在不依赖显式提交按钮的前提下实现POST传值，传递的参数不会暴露在URL地址栏中。

方案1：JS动态构造隐藏表单模拟POST提交 #

完全适配现有导航栏结构，和传统POST表单的接收逻辑完全兼容，无额外后端改造量

• 实现逻辑：拦截导航a标签的默认GET跳转行为，动态生成完全隐藏的POST表单，携带需要传递的参数提交到目标页面
• 落地步骤：
  1. 在Name.php页面遍历PostgreSQL查询结果时，把需要跨页传递的字段嵌入导航标签的自定义属性中：

  // 保留原有数据库连接、SQL查询的逻辑
  while ($row = pg_fetch_assoc($result)) {
      // 渲染Age导航入口，把查询到的code、name存在自定义属性里
      echo '<a href="Age.php" class="js-post-nav"
              data-target="Age.php"
              data-post-code="'.htmlspecialchars($row['code']).'"
              data-post-name="'.htmlspecialchars($row['name']).'">Age</a>';
  }
  

  2. 给所有导航入口绑定统一的点击监听，拦截默认跳转并构造提交表单：

  document.querySelectorAll('.js-post-nav').forEach(navItem => {
      navItem.addEventListener('click', function(e) {
          // 阻止a标签默认的GET跳转
          e.preventDefault();
          // 创建隐藏的POST表单
          const submitForm = document.createElement('form');
          submitForm.method = 'POST';
          submitForm.action = this.dataset.target;
          // 遍历标签上所有携带data-post-前缀的属性，生成对应隐藏字段
          Object.entries(this.dataset).forEach(([key, value]) => {
              if (key.startsWith('post')) {
                  const hiddenInput = document.createElement('input');
                  hiddenInput.type = 'hidden';
                  // 去掉属性名中的post前缀，生成和原有逻辑一致的字段名
                  hiddenInput.name = key.replace('post', '').toLowerCase();
                  hiddenInput.value = value;
                  submitForm.appendChild(hiddenInput);
              }
          })
          // 将表单挂载到DOM树后提交（部分浏览器要求表单必须在页面节点中才能正常提交）
          document.body.appendChild(submitForm);
          submitForm.submit();
      })
  })
  

• 效果验证：目标页面Age.php可直接通过$_POST['code']、$_POST['name']读取参数，和传统POST表单的接收逻辑完全一致，地址栏不会暴露任何传递参数。

方案2：Session存储跨页共享数据 #

适合需要在多个导航页面间连续传递同一组数据的场景，无前端JS依赖

• 实现逻辑：拿到数据库查询结果后，直接把需要跨页传递的字段写入当前用户的Session会话存储中，导航跳转仅做普通页面跳转，不携带任何参数
• 落地步骤：
  1. 所有涉及跨页传值的页面开头，先开启Session会话：

  session_start();
  

  2. 在Name.php页面拿到PostgreSQL查询结果后，把需要共享的字段写入Session：

  while ($row = pg_fetch_assoc($result)) {
      $_SESSION['active_people_info'] = [
          'code' => $row['code'],
          'name' => $row['name']
      ];
  }
  

  3. 导航栏直接使用普通a标签即可，不需要拼接任何参数：

  <a href="Age.php">Age</a>
  <a href="Address.php">Address</a>
  

  4. 在Age.php、Address.php等目标页面中，直接从Session读取共享数据，不需要接收任何URL或表单参数：

  session_start();
  // 校验会话中是否存在有效数据，避免直接访问目标页面出现空值报错
  if (!isset($_SESSION['active_people_info'])) {
      header('Location: Name.php');
      exit;
  }
  $current_code = $_SESSION['active_people_info']['code'];
  $current_name = $_SESSION['active_people_info']['name'];
  

• 注意事项：当不再需要这组共享数据时，及时通过unset($_SESSION['active_people_info'])清理旧值，避免会话残留旧数据干扰后续操作。

方案3：Fetch发起POST请求实现无刷新跳转 #

适合需要在跳转前做接口校验、异步逻辑处理的场景

• 实现逻辑：点击导航时，通过fetch携带POST参数请求目标页面接口，拿到响应后动态替换当前页面内容完成跳转
• 简单实现示例：

  async function postNavJump(targetUrl, postParams) {
      const res = await fetch(targetUrl, {
          method: 'POST',
          headers: {
              'Content-Type': 'application/json'
          },
          body: JSON.stringify(postParams)
      })
      // 将目标页面返回的内容直接替换当前页面body，实现跳转效果
      document.body.innerHTML = await res.text();
  }
  

• 注意事项：该方式由JS接管跳转流程，浏览器地址栏不会自动变更为目标页面URL，和传统整页跳转的体验有差异，优先推荐前两种方案匹配现有导航逻辑。

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