提问者:小点点

如何以HTML格式提交联系表单和接收电子邮件


null

<!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>

null

嗨! 我正在尝试做一个联系表单,但我无法收到通过表单发送的电子邮件。。。实际上它从来没有发送数据。。。我能做什么? 我想在用户点击发送按钮时收到我的gmail上的数据。


共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/

相关问题