如何在formsubmit.co表单提交时隐藏'govheading'字段名称

你的问题核心是未勾选复选框时，govheading字段名依然会被提交到formsubmit并出现在邮件里——原因在于你额外加了一个同名的隐藏input（即使值为空，formsubmit也会把字段名带上），且之前的onsubmit操作只是隐藏元素，不影响表单提交逻辑。

直接按以下步骤修改即可解决：

1. 移除冗余的隐藏input字段
   删掉这段代码：

   <input type="hidden" name="govheading" value="">
   

   这个字段会强制govheading被提交，不管复选框状态如何。

2. 修改表单提交逻辑
   在表单提交前判断复选框是否勾选，未勾选时移除该字段的name属性（没有name的表单元素不会被提交）：

   优先用更规范的事件绑定写法：

   <form action="https://formsubmit.co/email@email.co.uk" method="POST">
     <input class="govuk-checkboxes__input" id="govheading" name="govheading" type="checkbox" value='Yes this relates to my feedback'>
     <!-- 其他表单内容 -->
     <button type="submit">提交</button>
   </form>
   
   <script>
   document.querySelector('form').addEventListener('submit', function() {
     const checkbox = document.getElementById('govheading');
     if (!checkbox.checked) {
       checkbox.removeAttribute('name');
     }
   });
   </script>
   

   若坚持用内联onsubmit，可改成这样：

   <form action="https://formsubmit.co/email@email.co.uk" method="POST" onsubmit="return handleSubmit()">
     <!-- 表单元素 -->
   </form>
   
   <script>
   function handleSubmit() {
     const checkbox = document.getElementById('govheading');
     if (!checkbox.checked) {
       checkbox.removeAttribute('name');
     }
     return true;
   }
   </script>
   

3. 关键注意事项
   如果你之前给复选框加了data-unchecked-value="not-agree"，请立刻移除这个属性——它会让formsubmit在复选框未勾选时也提交该字段（值为not-agree），完全违背你要隐藏字段名的需求。

这样修改后，只有用户勾选复选框时，govheading字段才会被提交到formsubmit；未勾选时该字段不会出现在提交数据里，邮件自然就不会显示这个字段名了。

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