我在一个HTML文档中有几个mailto链接。
<a href="mailto:etc...">
我可以插入HTML格式的身体在mailto: href的一部分?
<a href="mailto:me@me.com?subject=Me&body=<b>ME</b>">Mail me</a>
请注意(2016)在iOS中,添加<i>和<b>标签用于简单的斜体、粗体格式是完全没问题的。
我在一个HTML文档中有几个mailto链接。
<a href="mailto:etc...">
我可以插入HTML格式的身体在mailto: href的一部分?
<a href="mailto:me@me.com?subject=Me&body=<b>ME</b>">Mail me</a>
请注意(2016)在iOS中,添加<i>和<b>标签用于简单的斜体、粗体格式是完全没问题的。
我已经使用了这个,它似乎与outlook工作,不使用html,但你可以格式化文本与换行符,至少当正文被添加为输出。
<a href="mailto:email@address.com?subject=Hello world&body=Line one%0DLine two">Email me</a>
虽然不可能使用HTML来格式化你的电子邮件正文,你可以添加换行符,就像之前建议的那样。
如果你能够使用javascript,那么“encodeURIComponent()”可能会像下面这样使用…
var formattedBody = "FirstLine \n Second Line \n Third Line";
var mailToLink = "mailto:x@y.com?body=" + encodeURIComponent(formattedBody);
window.location.href = mailToLink;
It is worth pointing out that on Safari on the iPhone, at least, inserting basic HTML tags such as <b>, <i>, and <img> (which ideally you shouldn't use in other circumstances anymore anyway, preferring CSS) into the body parameter in the mailto: does appear to work - they are honored within the email client. I haven't done exhaustive testing to see if this is supported by other mobile or desktop browser/email client combos. It's also dubious whether this is really standards-compliant. Might be useful if you are building for that platform, though.
正如其他响应所指出的,在将encodeURIComponent嵌入到mailto:链接之前,还应该在整个正文上使用encodeURIComponent。
正如你在RFC 6068中看到的,这根本不可能:
特殊的<hfname> "body"表示相关的<hfvalue> . body 是消息的主体。“body”字段值用于 控件的第一个文本/普通主体部分的内容 消息。“body”伪报头字段主要用于 用于自动处理的短文本消息的生成(例如 作为邮件列表的“订阅”消息),而不是一般的MIME 的身体。
有些事情是可能的,但不是所有的,例如你想要换行,而不是使用<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>
这不是你想要的,但可以使用现代javascript在客户端创建一个EML文件,并将其传输到用户的文件系统,这应该会在他们的邮件程序中打开一个包含HTML的富电子邮件,如Outlook:
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 <user@domain.demo>
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>
Javascript
(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);
})();
任何人都可以尝试以下(mailto函数只接受明文,但在这里我展示如何使用HTML内文属性,以及如何添加锚作为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
Whilst it may not be possible within the parameter of the URL, there is a cheeky solution which allows full HTML. The concept is that you have a hidden element on the page (I am using Bootstrap and Jquery in the example below) which is temporarily revealed and the HTML copied (as per here: How to copy text from a div to clipboard). Following that, you redirect the user to the Mail link so in effect all they then have to do is hit Paste within their designated mail program. I've only tested this on Linux/Thunderbird but the paste also works into Gmail web.
<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');
})