-1

我最近使用 HTML 5 模板为朋友的企业创建了一个简单的网站。它也包含一些可爱的 Javascript 元素。网站网址是www.michianamemories.com

其中一个元素是页面底部的联系表。看起来“发送消息”按钮被编码为什么都不做。让这个表单将用户输入的值(即:他们的姓名、电子邮件和他们的消息)转发到专用的电子邮件收件箱有多简单?

如果不是那么简单,还有哪些其他选项可以使表单具有功能性并与站点的一般主题集成?

我假设答案很简单,但我是 HTML 5 的新手,对 Javascript 完全一无所知。提前感谢您的帮助。

4

4 回答 4

0

这在纯 Javascript 中是不可能的。发送电子邮件需要服务器端处理。

有几个网站可以让您生成简单的电子邮件表单,请查看:http ://www.google.com/search?hl=en&safe=off&q=email+form+generator&aq=5&aqi=g10&aql=&oq=email+form

于 2013-05-09T02:32:15.577 回答
0

HTML 不允许您向电子邮件提交表单。

您可以使用mailto,但它不是最友好的功能。它将打开 Outlook 并将表单数据转储到电子邮件内容中。虽然有很多问题。

有关邮件的更多信息

我的建议是使用“表单邮件脚本”。但这仅在服务器端完成,因此您需要有一个 Web 服务器。你需要谷歌并阅读它们。

关于表单提交选项的参考

于 2013-05-09T02:37:41.273 回答
0

正如其他答案中提到的,您不能使用 HTML5 发送电子邮件。这需要在您的服务器上完成。

不过,一种简单且免费的解决方案是使用Google Apps Script。您可以将您的 Apps 脚本发布为 Web 应用程序,并使用doPost如下方法:

function doPost(e){
    var email = e.parameter.email;
    var subject = 'E-mail from website';
    var message = e.parameter.message;
    MailApp.sendEmail(emailAddress, subject, message);

    return ContentService.createTextOutput('E-mail sent!');
}

在您的 HTML 中,您将拥有这样的表单:

<form action="url to your deployed app script" method="post">
    <input type="email" name="email"></input>
    <textarea name="message"></textarea>
    <input type="submit" value="Submit"></input>
</form>

当您将 Apps 脚本部署为 Web 应用程序时,将显示要放入action属性的 URL:

部署为 Web 应用屏幕截图

于 2017-05-29T00:05:59.807 回答
0

在我看来,你能做的最好的事情就是用 PHP 创建一个简单的后端应用程序。

  1. mail.php在根目录中创建文件。
  2. 在您的 HTMLform标记中,您需要添加带有文件action路径和属性的属性,以便表单知道使用哪种 HTTP 请求方法来发送数据。这将添加触发“发送消息”按钮的操作,您说该按钮不起作用。mail.phpmethod<form action="mail.php" method ="post">

    发生这种情况是因为现在按钮知道如果您单击它会做什么。它从表单输入字段中获取所有数据并将它们发送到mail.php文件。该文件需要获取它们并验证它们。(您至少应该为表单中的必填字段创建验证,以检查它们是否不为空。您可以在内置 html 属性中或借助 JavaScript 进行一些额外的验证)

  3. 现在最重要的是在您的mail.php. 这是您执行此操作所需的所有文档:PHP 邮件文档

这是代码(您的网站无法正常工作,所以我只是在输入字段中即兴创作):

HTML:

<form action="mail.php" method="post">

    <label for="name-field">Name:</label>
    <input id="name-field" name="name" type="text" required>

    <label for="surname-field">Surname:</label>
    <input id="surname-field" name="surname" type="text" required>

    <label for="message-field">Message:</label>
    <textarea id="message-field" name="message" required></textarea>

    <label for="mail-field">Your e-mail:</label>
    <input id="mail-field" name="mail" type="mail" required>

    <button type="submit">Send Message</button>

</form>

PHP:

// Validating if everything is filled
if(isset($_POST['name']) && isset($_POST['surname']) && isset($_POST['message']) && isset($_POST['mail'])
{
    $to = "example@mysite.com";
    $subject = "Automatically generated messege from" . $_POST['name'] . ' ' . $_POST['surname'];
    $body = $_POST['message'];
    $headers = 'To: ' . $to . "\r\n";
    $headers .= 'From: ' . $_POST['mail'];

    // Send mail function
    if(mail($to, $subject, $body, $headers))
    { 
        echo 'Mail sent successfuly!';
    } else {
        echo 'Error occurred while sending the message';
    }
}
于 2016-09-24T11:09:33.803 回答