如何创建一个 mailto 共享按钮，该按钮打开一个窗口，用户可以在其中输入要发送到的电子邮件地址

我一直在互联网上搜索，以了解如何创建一个mailto共享按钮，该按钮打开一个新窗口，然后用户可以在其中输入他选择发送到的电子邮件地址。我附上了一组连续的图像作为操作示例：

这有什么诀窍？为什么我找不到有关如何编写此类代码的任何信息....堆栈溢出也绝对无处可去！

截至目前，这是我拥有的代码：

$('.share-page-on-Email').click(function() {
window.open("mailto:"+emailTo+'?cc='+emailCC+'&subject='+emailSub+'&body='+emailBody, '_self');
});

在此处查看我的原型电子邮件共享按钮在我的代码笔上：https://codepen.io/IDCoder/full/rpdBQJ/

提前感谢您的帮助！

你可以像这样使用 window.location.href：

window.location.href = 'mailto:email@domain.com'

我建议永远不要使用mailto：功能，因为它的行为不可预测，在不同的设备上不同，有时甚至完全失败。您可以创建一个页面来获取电子邮件字符串，然后在服务器端对它做任何您想做的事情。使弹出窗口/弹出窗口变小，例如：

<a href="/my-email-collector-page"
onclick="window.open(this.href,'targetWindow',
'toolbar=no,
location=no,
status=no,
menubar=no,
scrollbars=yes,
resizable=yes,
width=200px,
height=120px');
return false;">email</a>

您可以使用navigator.registerProtocolHandler()来设置特定域来处理特定协议，如获取Gmail处理所有邮件收件人：链接中的@PaulIrish所示。

.registerProtocolHandler()必须在 Web 应用程序处理协议的源处调用，否则会发生错误。

用户代理必须抛出"安全错误"DOMException，如果生成的 URL 记录的来源与由此设置对象的相关设置对象指定的原点 NavigatorContentUtils 对象。

例如，您可以导航到"https ：//mail.google.com/mail/#inbox"，然后在console

navigator.registerProtocolHandler("mailto",
"https://mail.google.com/mail/?extsrc=mailto&url=%s",
"Gmail");
var email = `<a href="mailto:yourbestfriend@example.com?subject=registerProtocolHandler()%20FTW!&amp;body=Check%20out%20what%20I%20learned%20at%20http%3A%2F%2Fupdates.html5rocks.com%2F2012%2F02%2FGetting-Gmail-to-handle-all-mailto-links-with-registerProtocolHandler%0A%0APlus%2C%20flawless%20handling%20of%20the%20subject%20and%20body%20parameters.%20Bonus%20from%20RFC%202368!" target="_blank">this mailto: link</a>`;
document.body.insertAdjacentHTML("beforeend", email);
document.body.querySelector("a[href^=mailto]:nth-last-of-type(1)").click();

这应该启动一个标题为"撰写邮件"的window，并填充主题和正文。

要包含"cc"，您可以放置

cc=email@domain.com&amp;

在最后一个后面的字符串中

&amp;

在

?subject=

行，请参阅具有多个抄送地址的邮件。

或者为您自己的在线电子邮件应用程序编写服务，以实现对特定协议的请求的相同处理。

相关内容

最新更新

热门标签：