TYPO3表单动态填充职位隐藏字段并传递至邮件的实现求助

1. 确认隐藏字段的前端标识 #

先核对你在Form YAML里定义的隐藏字段，确保前端渲染后有明确的name或id属性。比如YAML配置：

type: Hidden
identifier: position
label: Position

前端会生成类似代码：

<input type="hidden" name="position" id="form-position">

记好这个name（比如position），后续JS要通过它定位字段。

2. JS代码的放置位置（三种可选方案） #

方式一：表单模板嵌入（最直接） #

如果你的表单使用了自定义模板，直接在表单模板文件（比如Form.html）末尾添加这段JS：

document.addEventListener('DOMContentLoaded', () => {
  const currentUrl = window.location.href;
  // 仅在职位申请页触发（URL包含/jobs/）
  if (currentUrl.includes('/jobs/')) {
    // 提取URL最后一段，自动去除可能的查询参数
    const positionName = window.location.pathname.split('/').pop().replace(/\?.*/, '');
    // 找到隐藏字段并赋值
    const positionField = document.querySelector('input[name="position"]');
    if (positionField) positionField.value = positionName;
  }
});

模板文件一般存放在typo3conf/ext/你的扩展/Resources/Private/Templates/Form/目录下；若使用系统默认模板，可复制模板文件到自己的扩展中进行覆盖修改。

方式二：页面属性单独添加（精准控制） #

不想修改模板的话，直接给职位申请页面单独配置JS：

• 进入TYPO3后台，打开目标职位页面的编辑界面，切换到「资源」标签页
• 在「JavaScript代码」文本框中粘贴上述JS代码
  这种方式仅对当前职位页生效，完全不会影响联系页的表单逻辑。

方式三：全局JS文件加载（多职位页场景） #

如果有多个职位申请页面，可将JS写入单独文件后全局加载：

1. 在你的站点扩展中创建Resources/Public/JS/form-position.js，将上述JS代码写入该文件
2. 在站点的setup.typoscript配置中添加：

page.includeJSFooter.formPosition = EXT:你的扩展/Resources/Public/JS/form-position.js

JS中的判断逻辑会自动识别职位页并触发赋值，联系页不会受到影响。

3. 功能验证 #

• 访问职位申请页，按F12打开浏览器控制台，检查隐藏字段的value是否被正确设置为URL最后一段内容
• 提交表单，确认收到的邮件中包含职位名字段信息
• 访问联系页，确认隐藏字段值为空，不影响普通咨询的提交流程

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