如何提交联系表格并接收 HTML 格式的电子邮件答案

【问题标题】：How to submit contact form and recieve Email in HTML如何提交联系表格并接收 HTML 格式的电子邮件
【发布时间】：2020-07-02 21:59:37
【问题描述】：

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <link rel="stylesheet" href="./css/styles.css">
  <title>Contact Us</title>
</head>

<body>
  <form action="MAILTO: xyz@gmail.com" method="post" enctype="text/plain"></form>
  <div class="wrapper">
    <div class="title">
      <h1>contact us form</h1>
    </div>
    <div class="contact-form">
      <div class="input-fields">
        <input type="text" class="input" placeholder="Name" required>
        <input type="text" class="input" placeholder="Email Address" required>
        <input type="text" class="input" placeholder="Phone" required>
        <input type="text" class="input" placeholder="Subject" required>
      </div>
      <div class="msg">
        <textarea placeholder="Message"></textarea>
        <button type="submit">Send</button>
        <!-- <div class="btn">send</div> -->
      </div>
    </div>
  </div>
  </form>
</body>

</html>

嗨！我正在尝试制作联系表格，但我无法接收表格发送的电子邮件....实际上它从不发送数据...我该怎么办？当用户单击发送按钮时，我想在我的 gmail 上接收数据。

【问题讨论】：

您正在关闭</form>
为了安全和隐私，请勿将您的实际电子邮件放在问题中。
还是不行。
这能回答你的问题吗？ HTML mailto form
将此行 <form action="MAILTO: xyz@gmail.com" method="post" enctype="text/plain"></form> 替换为 <form action="mailto:xyz@gmail.com" method="post" enctype="text/plain">

标签： html css

【解决方案1】：

在您开始表单的行的末尾有一个结束标记。

 <form action="MAILTO: xyz@gmail.com" method="post" enctype="text/plain">
  <div class="wrapper">
    <div class="title">
      <h1>contact us form</h1>
    </div>
    <div class="contact-form">
      <div class="input-fields">
        <input type="text" class="input" placeholder="Name" required>
        <input type="text" class="input" placeholder="Email Address" required>
        <input type="text" class="input" placeholder="Phone" required>
        <input type="text" class="input" placeholder="Subject" required>
      </div>
      <div class="msg">
        <textarea placeholder="Message"></textarea>
        <button type="submit">Send</button>
        <!-- <div class="btn">send</div> -->
      </div>
    </div>
  </div>
  </form>

试试上面的方法。

除此之外，所有这些代码都会在您的计算机上打开一个客户端，供用户直接发送电子邮件。它不会从浏览器直接向用户提交消息。如果你想这样做，你将不得不使用后端代码。我建议使用 Node.js 和 Nodemailer。这是一个很好的链接，解释了这一点：

https://blog.mailtrap.io/nodemailer-gmail/

【讨论】：

这只是 OP 的一个 TYPO，不是这里的实际问题。