mail链接到 HTML 正文

mailto link with HTML body

提问人:GxG 提问时间:4/11/2011 最后编辑:BalusCGxG 更新时间:7/13/2023 访问量:602869

问:

我在 HTML 文档中有几个链接。mailto

<a href="mailto:etc...">

我可以在 ?mailto:href

<a href="mailto:[email protected]?subject=Me&body=<b>ME</b>">Mail me</a>

请注意,在 iOS 中 (2016),添加和标签以进行简单的斜体、粗体格式是完全可以的。<i><b>

html 电子邮件 mailto

评论

1赞 Hannes R. 10/2/2012
心里想着一模一样的东西,研究了一会儿。我试图在消息正文中嵌入一个嵌入式远程 <img>。mailto 指令需要经过 URL 编码才能正常工作。Thunderbird 的结果是 HTML 正文按字面意思出现,带有所有<img>指令和所有指令。我想这是 thunderbird 和大多数邮件客户端的安全问题 - 它们解析传入的邮件内容,以便它不会做任何可疑的事情。
5赞 Stu Andrews 5/5/2014
我能找到的最好的来自这个页面,zaposphere.com/html-email-links-code..底部给出了一个列表:“大多数其他网站没有提到的其他很酷的自定义!帮了我很多忙。
0赞 Dawson B 11/9/2017
您可以使用基本文本设置电子邮件的每个部分。关于无法进行 html 格式设置的限制,这里有一个我构建的工具,可以使自定义 mailto 中的各种字段变得非常简单: mailto.now.sh

答:

72赞 Andy 2/23/2012 #1

我已经使用了它,它似乎适用于 outlook,而不是使用 html,但至少在将正文添加为输出时,您可以使用换行符格式化文本。

<a href="mailto:[email protected]?subject=Hello world&body=Line one%0DLine two">Email me</a>

评论

2赞 wide_eyed_pupil 9/19/2012
所以“%0D”是换行符。编码选项卡的代码等效物是什么?
4赞 Jim Bergman 12/7/2012
%0D 是换行符,即 ctrl-m,制表符是 ctrl-i,即 %09。看看像这样的 ASCII 图表 [asciitable.com/index/asciifull.gif]。控制字符介于 1 到 31 之间。@wide_eyed_pupil
3赞 Valentin Despa 7/10/2013
执行此操作时,似乎删除了任何签名。
8赞 Chloe 10/10/2017
那不是 HTML 正文!
1赞 Vinay 10/27/2020
漂亮,也可以在 confluence 中工作 在页面上插入链接。
119赞 Oliver Pearmain 5/10/2012 #2

虽然不可能使用 HTML 来格式化您的电子邮件正文,但您可以按照之前的建议添加换行符。

如果您能够使用 javascript,那么“encodeURIComponent()”可能会像下面这样有用......

var formattedBody = "FirstLine \n Second Line \n Third Line";
var mailToLink = "mailto:[email protected]?body=" + encodeURIComponent(formattedBody);
window.location.href = mailToLink;

评论

1赞 wide_eyed_pupil 9/19/2012
电子邮件客户端可以运行嵌入式 Javascript 吗?OP说这是一封电子邮件,而不是mailto:链接所在的网页。
0赞 FireDragon 9/6/2013
谢谢,在 Rails 中,您可以使用该函数来封装文本并将其转换为电子邮件正文的换行符和制表符raw("text \n more text \n\n\t")
0赞 Luke 11/13/2014
这对我有用,从 Chrome“mailto”发送到 Outlook。请注意,您只能对正文文本进行编码,而不能对整个 mailto 字符串进行编码;并且您不需要在 .\n
2赞 Oliver Gray 11/20/2015
我喜欢这种方法,这里有一个 jsfiddle 来查看它的实际效果: jsfiddle.net/oligray/5uosngy4
5赞 Dirk Boer 4/5/2016
您也可以只使用 %0A 作为换行符,因此您不需要从 JavaScript 中执行此操作。
16赞 Andrew Ferrier 5/17/2012 #3

值得指出的是,至少在 iPhone 上的 Safari 上,将基本的 HTML 标签(例如 、 和 )插入到 body 参数中,例如 、 和 (理想情况下,无论如何您都不应该在其他情况下使用,更喜欢 CSS)确实可以工作 - 它们在电子邮件客户端中是有效的。我还没有做过详尽的测试,看看其他移动或桌面浏览器/电子邮件客户端组合是否支持这一点。这是否真的符合标准也是值得怀疑的。不过,如果您正在为该平台构建,可能会很有用。<b><i><img>mailto:

正如其他响应所指出的,在将 encodeURIComponent 嵌入到链接中之前,您还应该在整个正文上使用 encodeURIComponent。mailto:

评论

0赞 Fattie 8/4/2016
是的,无论如何,在 iOS 中添加简单的粗体斜体标签确实可以完美工作。
0赞 Vitaly Zdanevich 2/6/2019
在iOS上,我无法使用<img src='mybase64'/>发送正确的电子邮件 - 在Gmail中,我在邮件中看到base64。
475赞 Alfonso Marin 11/16/2012 #4

正如您在 RFC 6068 中看到的那样,这根本不可能:

特殊的“正文”表示关联的是消息的正文。“body”字段值旨在 包含第一个文本/纯正文部分的内容 消息。“body”伪标头字段主要用于 生成用于自动处理的短文本消息(如 作为邮件列表的“订阅”邮件),而不是一般的 MIME 机构。<hfname><hfvalue>

评论

11赞 Joe 5/24/2018
如果您对这个答案感到失望,请继续阅读: stackoverflow.com/a/46699855/256272 (tl;DR .eml 文件)
38赞 Stephen Kaufman 1/29/2014 #5

有些事情是可能的,但不是全部,例如,你想要换行符,而不是使用 use<br />%0D%0A

例:

<a href="mailto:?subject=&body=Hello,%0D%0A%0D%0AHere is the link to the PDF Brochure.%0D%0A%0D%0ATo view the brochure please click the following link: http://www.uyslist.com/yachts/brochure.pdf"><img src="images/email.png" alt="EMail PDF Brochure" /></a>                        

评论

11赞 Brad 12/2/2014
那不是 HTML......静止文本。
0赞 Stephen Kaufman 12/10/2014
如果您使用 $mailheader .= “Content-type: text/html;字符集=ISO-8859-1\r\n“;
14赞 Narxx 12/17/2014
@StephenKaufman - 您不是发送电子邮件的人,而是单击链接的客户。这意味着您不知道电子邮件客户端是如何设置的。你不知道它的标题是如何设置的。这适用于某些电子邮件客户端,而不适用于其他客户端。
1赞 hamish 11/7/2019
谢谢,这对我来说是第二好的选择,如果我不能做html,那么至少我可以做回车。我很好。
81赞 Matthew 10/12/2017 #6

这并不完全是您想要的,但可以使用现代 javascript 在客户端上创建一个 EML 文件并将其流式传输到用户的文件系统,这应该会在他们的邮件程序(例如 Outlook)中打开包含 HTML 的丰富电子邮件:

https://stackoverflow.com/a/27971771/8595398

下面是包含图像和表格的电子邮件的 jsfiddle: https://jsfiddle.net/seanodotcom/yd1n8Lfh/

[HTML全

<!-- https://jsfiddle.net/seanodotcom/yd1n8Lfh -->
<textarea id="textbox" style="width: 300px; height: 600px;">
To: User <[email protected]>
Subject: Subject
X-Unsent: 1
Content-Type: text/html

<html>
<head>
<style>
    body, html, table {
        font-family: Calibri, Arial, sans-serif;
    }
    .pastdue { color: crimson; }
    table {
        border: 1px solid silver;
        padding: 6px;
    }
    thead {
        text-align: center;
        font-size: 1.2em;
        color: navy;
        background-color: silver;
        font-weight: bold;
    }
    tbody td {
        text-align: center;
    }
</style>
</head>
<body>
<table width=100%>
    <tr>
        <td><img src="http://www.laurell.com/images/logo/laurell_logo_storefront.jpg" width="200" height="57" alt=""></td>
        <td align="right"><h1><span class="pastdue">PAST DUE</span> INVOICE</h1></td>
    </tr>
</table>
<table width=100%>
    <thead>
        <th>Invoice #</th>
        <th>Days Overdue</th>
        <th>Amount Owed</th>
    </thead>
    <tbody>
    <tr>
        <td>OU812</td>
        <td>9</td>
        <td>$4395.00</td>
    </tr>
    <tr>
        <td>OU812</td>
        <td>9</td>
        <td>$4395.00</td>
    </tr>
    <tr>
        <td>OU812</td>
        <td>9</td>
        <td>$4395.00</td>
    </tr>
    </tbody>
</table>
</body>
</html>
</textarea> <br>
<button id="create">Create file</button><br><br>
<a download="message.eml" id="downloadlink" style="display: none">Download</a>

Java脚本

(function () {
var textFile = null,
  makeTextFile = function (text) {
    var data = new Blob([text], {type: 'text/plain'});
    if (textFile !== null) {
      window.URL.revokeObjectURL(textFile);
    }
    textFile = window.URL.createObjectURL(data);
    return textFile;
  };

  var create = document.getElementById('create'),
    textbox = document.getElementById('textbox');
  create.addEventListener('click', function () {
    var link = document.getElementById('downloadlink');
    link.href = makeTextFile(textbox.value);
    link.style.display = 'block';
  }, false);
})();

评论

15赞 Greg 12/5/2017
现在这是一个奇特的想法
2赞 pmarreck 12/7/2017
好主意,但只是为了记录,在最新的 Apple Mail 上,此文件将打开但不可编辑/发送,它就像已发送的电子邮件记录
2赞 Collierton 3/13/2018
使用 Apple Mail (11.2),打开.eml文件后,您可以从菜单 (shift-cmd-D) 中选择消息/再次发送以将电子邮件置于编辑模式。
11赞 yougotiger 9/3/2020
这个解决方案在另一个类似的问题上进行了探讨。然而,事实证明,正如@JamesBell提到的:令人不快的更新:Chrome(从大约 v.46 开始)已经开始标记。EML 文件可能是恶意的。不知道文本文件会引起什么恐怖,但我认为他们有他们的理由。– James Bell Jun 29 '16 at 20:03
1赞 Andreas Covidiot 5/11/2021
不适用于 Outlook 16 和 FF 78 或 IE 11,但不适用于 Edge 90。
0赞 Miguel Ballén 6/13/2019 #7

任何人都可以尝试以下操作(mailto 函数只接受纯文本,但在这里我展示了如何使用 HTML innertext 属性以及如何添加锚点作为 mailto 正文参数):

//Create as many html elements you need.

const titleElement = document.createElement("DIV");
titleElement.innerHTML = this.shareInformation.title; // Just some string

//Here I create an <a> so I can use href property
const titleLinkElement = document.createElement("a");
titleLinkElement.href = this.shareInformation.link; // This is a url

...

let mail = document.createElement("a");

// Using es6 template literals add the html innerText property and anchor element created to mailto body parameter
mail.href = 
  `mailto:?subject=${titleElement.innerText}&body=${titleLinkElement}%0D%0A${abstractElement.innerText}`;
mail.click();

// Notice how I use ${titleLinkElement} that is an anchor element, so mailto uses its href and renders the url I needed
14赞 Peter 9/6/2019 #8

Thunderbird 支持html-bodymailto:[email protected]?subject=Me&html-body=<b>ME</b>

1赞 Antony 7/29/2022 #9

虽然在 URL 的参数中可能无法实现,但有一个厚颜无耻的解决方案可以允许完整的 HTML。这个概念是你在页面上有一个隐藏的元素(我在下面的例子中使用了 Bootstrap 和 Jquery),它被暂时显示并复制了 HTML(如这里:如何将文本从 div 复制到剪贴板)。之后,您将用户重定向到邮件链接,因此实际上他们所要做的就是在他们指定的邮件程序中点击粘贴。我只在 Linux/Thunderbird 上测试过,但粘贴也适用于 Gmail 网络。

<div id="copyEmailText" class="d-none"><p><strong>This is some HTML</strong>. Please hit paste when your email program opens.</p>

function copyDivToClipboard(element) {
    var range = document.createRange();
    range.selectNode(element);
    window.getSelection().removeAllRanges(); // clear current selection
    window.getSelection().addRange(range); // to select text
    document.execCommand('copy');
    window.getSelection().removeAllRanges();// to deselect
}

$('#copyEmail').on('click',function(){
    $('#copyEmailText').toggleClass('d-none');
    copyDivToClipboard($('#copyEmailText')[0]);
    window.location.href = 'mailto:?subject=Email subject text';
    $('#copyEmailText').toggleClass('d-none');
})

评论

1赞 Mark Richman 6/22/2023
点击粘贴会破坏邮件链接的正文参数的目的。