如何在自我提交表单上使用mailto？

Question

我必须对现有代码进行修改，并且我正在努力使用 mailto 功能。 我希望当我提交表单时，会使用 Outlook（或任何其他配置的邮件程序）打开预先填充的邮件，以便用户可以检查是否有任何问题，然后提交带有表单数据的邮件。

我想使用mailto:因为目前页面（即在本地服务器上，而不是在互联网上）仅适用于 IE（最后一个开发人员使用 ActiveX 数据对象，但它不适用于 Edge/Chrome/Firefox）。

我已经尝试将mailto:放在表单的action标签中，但它不起作用，我也尝试了一些 javascript 并且发生了同样的情况。 此外，我的表单使用$_SERVER['PHP_SELF']全局变量提交给自身。

表格/代码很大，所以我只会把可能对你有用的部分放出来帮助我。

这是我使用的表格：

echo "<FORM action=". $_SERVER['PHP_SELF'] . " name=\"form\" method=\"POST\">";
"my form here"
echo "<input type=\"submit\" name=\"Envoyer\" value=\"Send\"/>";
echo "</FORM>";

然后，我想从表单中获取数据并在用户点击提交按钮时打开一个邮件程序，其中包含一个预先填充的邮件，其中包含数据。

这是我使用的：

echo "<script>
    var email = $maildest;
    var subject = \"Request of the user\";
    var emailBody = $MAIL;
    window.location = \"mailto:\"+email+\"?subject=\"+subject+\"&body=\"+emailBody;";
    echo "</script>";
echo "An OUTLOOK window opened with the informations you entered. <br/>Send the email so we can take it into account.<br/>
exit(0);

我没有任何错误消息，页面工作正常，但是当我点击提交按钮时，没有任何反应，甚至邮件程序打开窗口或其他任何东西都没有。 我确定我遗漏了一些东西，而且我对 php/html/javascript 有点生疏，所以我来到这里寻求您的帮助。

Answer 1

如果您不回显内容，则阅读起来容易得多

如果这样做，您需要连接 PHP 样式并为 JavaScript 使用反引号
注意：您需要为带有 ${} javascript vars 的行加上单引号，否则 $ 被解释为：

echo "<script> 
      var email = \"".$maildest."\"; 
      var subject = encodeURIComponent(\"Request of the user\"); 
      var emailBody = encodeURIComponent(\`".$MAIL."\`);"
echo 'window.location = `mailto:${email}?subject=${subject}&body=${emailBody}`;';
echo "</script>"; 

请注意 $MAIL 和最后一行的反引号，因为那里可能有换行符

您还需要转义空格和特殊字符

在控制台中查看 - mailto 通常作为表单操作效果更好

没有回声：

?>
An OUTLOOK window opened with the informations you entered. <br/>Send the email so we can take it into account.<br/>
<script>
    var email = "<?= $maildest ?>";
    var subject = encodeURIComponent("Request of the user");
    var emailBody = encodeURIComponent(`<?= $MAIL ?>`);
    window.location = `mailto:${email}?subject=${subject}&body=${emailBody}`;
    </script>
<? 
exit(0);
?>

这是一个不使用服务器的版本：

 window.addEventListener("load", function() { document.getElementById("form").addEventListener("submit", function(e) { e.preventDefault(); var email = this.email.value, subject = encodeURIComponent("Request of the user"), elements = this.elements, emailTexts = []; [...elements].forEach(function(ele) { if (ele.type!="submit") emailTexts.push(ele.name + ":" + ele.value) }) var emailBody = encodeURIComponent(emailTexts.join("\\n")); var loc = `mailto:${email}?subject=${subject}&body=${emailBody}`; console.log(loc) window.location = loc; }); });

 An OUTLOOK window will open with the informations you enter. <br/>Send the email so we can take it into account.<br/> <form id="form" ....> Email: <input type="text" name="email" value="" /><br/> Name: <input type="text" name="Name" value="" /><br/> Comment: <textarea name="Comment"></textarea><br/> <input type="submit" /> </form>

Answer 2

您必须在表单上设置事件，因为您的 JS 代码只在页面呈现时工作，而不是在表单提交时工作。

<form action=". $_SERVER['PHP_SELF'] . " name="form" method="POST" onsubmit="sendMail">
// Html form here
</form>
<script>
function sendMail(event) {
    // This method will stop default action of form's submit
    event.preventDefault();

    var email = "<?= $maildest ?>";
    var subject = encodeURIComponent("Request of the user");
    var emailBody = encodeURIComponent(`<?= $MAIL ?>`);
    window.location = `mailto:${email}?subject=${subject}&body=${emailBody}`;
}
</script>