如何获取HTML文本框输入内容并发送到指定邮箱？

解决方案 #

你之前的代码无法运行是因为现代浏览器普遍限制POST方式直接提交到mailto:地址，且无法将表单字段映射为邮件主题和正文，以下是两种可行实现方案： #

方案1：纯前端实现（依赖用户本地邮件客户端）

无需后端代码，提交后会唤起用户本地邮件客户端，用户确认后即可发送，代码如下：

<form id="feedback-form" method="get" action="mailto:email@server.co.uk">
  <!-- 姓名会自动映射为邮件主题 -->
  <input type="text" name="subject" placeholder="请输入您的姓名" required>
  <!-- 留言内容会自动映射为邮件正文 -->
  <textarea name="body" placeholder="请输入您的反馈留言" rows="4" required></textarea>
  <button type="submit">提交反馈</button>
</form>

该方案无需额外开发成本，但仅适合小流量站点使用，部分未安装本地邮件客户端的用户无法提交 #

方案2：后端中转实现（无感知提交，更稳定）

如果需要用户点击提交后直接发送邮件、不需要用户手动操作，使用后端服务中转是最优方案，实现逻辑如下：

• 前端编写表单收集用户姓名和留言，通过fetch/XMLHttpRequest异步提交到后端接口
• 后端接收两个参数后，调用邮件发送SDK（如Nodemailer、阿里云邮件推送、SendGrid等），将邮件主题设置为用户提交的姓名、邮件正文设置为用户提交的留言，发送到你的目标邮箱
• 后端返回提交状态，前端给用户展示成功/失败提示
  如果你使用的是静态站点托管平台，也可以直接使用平台自带的表单托管功能，不需要自行编写后端代码，只需给表单添加平台要求的属性标记即可自动收集提交内容并转发到你的邮箱。

文本框示例效果参考：

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