【问题标题】:Want HTML button to send email with input details希望 HTML 按钮发送带有输入详细信息的电子邮件
【发布时间】:2017-01-25 06:54:47
【问题描述】:

哪里出错了?我希望此按钮向我发送包含姓名和电子邮件地址的电子邮件。

<form action="mailto:myemail@email.com" class="form-inline">
  <div class="form-group">
   <label for="subscriberName">name</label>
   <input type="text" name="subscriberName" class="center-block form-control" placeholder="name" />
  </div>

  <div class="form-group">
    <label for="subscriberEmail">email</label>
    <input type="email" name="subscriberEmail" class="center-block form-control form-subs-email" placeholder="email" />
  </div>

  <button type="submit" class="btn btn-default">Subscribe</button>
</form>

【问题讨论】:

  • 你在传递数据吗?您需要 PHPmailer 或类似的工具来发送实际的表单。

标签: html email button input send


【解决方案1】:

动作需要以mailto:开头

<form action="mailto:myemail@email.com" class="form-inline">

另外,谢谢。我不知道你能做到。

【讨论】:

  • 哦,我一定忘了补充一点,当我编辑我的真实电子邮件地址时,它仍然无法正常工作:/ 我在某处看到添加了“value="Send Email",但似乎没有不过为我工作:/
  • 恕我直言,这不是一个兼容的解决方案。除非你认真地打算只用它来给自己发电子邮件而不是在实时网站上暗示?
  • 好吧,这就是我来这里的目的!我会很高兴有一个更好的解决方案来满足我的需要。
  • @norcaljohnny 你知道用例还是在猜测?
  • @MicahWilliamson- 尊敬的,有什么可以推测的? mailto:调用电子邮件客户端通过已设置的电子邮件应用程序发送表单。有些系统甚至不会提醒用户他们的电子邮件应用程序未配置为发送电子邮件。因此,他们认为他们发送了一封电子邮件,但如果需要,他们没有发送,也不会得到回复。但至于 OP,他昨天回答说,它不能满足他的需要。
【解决方案2】:

如果你真的想走这条路。问题出在您的第一行代码中。它应该看起来更像这样。

<form action="mailto:myemail@email.com?subject=newSubscriber" class="form-inline" enctype="text/plain"  method="post">

演示:JsFiddle

计划发送 HTML 表单 2 电子邮件?

要知道的事情。

是否有 HTML 代码可以通过表单提交发送电子邮件?

HTML 中没有将表单提交直接发送到电子邮件地址的功能。

“mailto”呢?

使用邮件: 您可以将表单的操作字段设置为“mailto”。在这种情况下,Web 浏览器调用电子邮件客户端将表单提交发送到指定的电子邮件地址。

但是,此方法在浏览器之间不兼容。它也不是用户友好的;在提交表单时,它会引发警告消息。有关此方法的更多详细信息,请参阅: 使用电子邮件表单

JavaScript 能否将表单提交发送到电子邮件地址?

没有。 JavaScript 也不能​​做电子邮件。如果客户端 JavaScript 允许以编程方式发送电子邮件,垃圾邮件发送者将首先利用它,你会讨厌你的网络浏览器!

那么,如何从 HTML 表单中获取电子邮件?

在进入解决方案之前,我将带您了解 Web 表单的一般结构。 Web 表单有两个部分:您在浏览器中看到的表单的前端和在 Web 服务器上运行的后端脚本。

您的网络浏览器使用 HTML 前端代码显示表单。当您提交表单时,浏览器会将您在表单中提交的信息发送到后端。

要了解如何做到这一点,我建议在这里阅读。 http://www.html-form-guide.com/email-form/html-email-form.html

【讨论】:

    猜你喜欢
    • 2014-07-12
    • 2017-10-28
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2011-08-12
    • 2018-07-06
    相关资源
    最近更新 更多