如何阻止HTML表单将变量$someValue通过$_POST提交至save.php？

嘿，我来帮你搞定这个问题！你遇到的核心点是：readonly只是禁止用户编辑输入框，但浏览器依然会把这个带name属性的字段值提交给服务器。要彻底阻止$someValue被POST到save.php，有几个更靠谱的方案：

1. 直接移除输入框的name属性（最稳妥） #

表单只会提交带有name属性的元素，所以只要把输入框的name="inputField"删掉，这个字段就不会出现在$_POST里了，代码修改后是这样：

<form action="save.php" method="post" onsubmit="return submitForm()">
  <tbody id="foo">
    <!-- 移除了name属性，只保留id用于JS操作或样式 -->
    <input type="text" id="inputField" value="<?php echo $someValue ?>">
  </tbody>
  <input type="submit" value="Save configuration" />
</form>

这个方法不需要额外的JS，从根源上避免了字段被提交，就算用户通过浏览器控制台修改了输入框内容，也不会被发送到服务器。

2. 用readonly配合隐藏字段（如果需要展示但提交其他值） #

如果你需要展示$someValue但要提交另一个相关值，可以把显示用的输入框设为readonly且去掉name，同时用hidden字段存放真正要提交的内容：

<form action="save.php" method="post" onsubmit="return submitForm()">
  <tbody id="foo">
    <!-- 仅用于展示，不会被提交 -->
    <input type="text" id="inputField" value="<?php echo $someValue ?>" readonly>
    <!-- 真正要提交的字段 -->
    <input type="hidden" name="actual_submit_value" value="your-target-value">
  </tbody>
  <input type="submit" value="Save configuration" />
</form>

3. 在提交前用JS动态移除name属性或清空值 #

如果因为某些原因必须保留name属性到提交前，可以在你的submitForm()函数里做处理：

function submitForm() {
  const input = document.getElementById("inputField");
  // 方案A：移除name属性，彻底排除提交
  input.removeAttribute("name");
  // 方案B：清空值（不如方案A稳妥，因为用户可能篡改）
  // input.value = "";
  return true;
}

注意：不要只依赖readonly，它完全不影响表单提交行为，只是限制用户编辑而已。

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