mailto ссылка с телом HTML


319

У меня есть несколько mailtoссылок в документе HTML.

<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>теги для простого курсивного, жирного форматирования.


1
Имел в виду то же самое и некоторое время изучал. Я пытался встроить удаленный <img> в тело сообщения. Инструкция mailto должна быть закодирована в URL, чтобы она работала. Результатом Thunderbird стало то, что тело HTML появилось буквально со всеми его инструкциями <img> и всем остальным. Я предполагаю, что это проблема безопасности в Thunderbird и большинстве почтовых клиентов - они анализируют входящий mailto-контент, чтобы он не делал ничего подозрительного.
Ханнес Р.

4
Лучшее, что я смог найти, было на этой странице, zaposphere.com/html-email-links-code . Внизу приведен список: «Другие интересные настройки, о которых большинство других сайтов не упоминают !!» Мне очень помогли.
Стю Эндрюс

Вы можете установить каждую часть электронного письма с основным текстом. Что касается ограничений, что форматирование html невозможно, вот инструмент, который я создал, чтобы упростить настройку различных полей в mailto dead: mailto.now.sh
Доусон Б.

Ответы:


428

Как вы можете видеть в RFC 6068 , это вообще невозможно:

Специальное <hfname>«тело» указывает, что ассоциированное <hfvalue> является телом сообщения. Значение поля «тело» предназначено для содержания содержимого первой текстовой / простой части тела сообщения. Поле псевдозаголовка «body» в первую очередь предназначено для генерации коротких текстовых сообщений для автоматической обработки (таких как сообщения «подписка» для списков рассылки), а не для общих тел MIME.


4
@JoeBlow Ответ по-прежнему правильный. RFC 6068, который устарел 2368, все еще говорит, что тело - это простой текст.
Маркус Лайр

8
Если вы разочарованы этим ответом, пожалуйста, продолжайте читать: stackoverflow.com/a/46699855/256272 (tl; dr .eml files)
Джо,

95

Нет, это невозможно вообще.


1
Не совсем верно. Хотя поддержка очень скудна, другие ответы показали, что в iOS возможен некоторый ограниченный HTML и комбинация IE + ActiveX + Outlook (ура, гадость).
Саймон Ист

89

Хотя использовать 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;

1
Могут ли почтовые клиенты запускать встроенный Javascript? ОП говорит, что это электронная почта, а не веб-страница, на которой будет ссылка mailto :.
wide_eyed_pupil

спасибо, в Rails вы можете использовать raw("text \n more text \n\n\t")функцию для инкапсуляции текста и преобразовать ее в разрывы строк и вкладки для тела письма
FireDragon

Это работало для меня, посылая из Chrome "mailto" в Outlook. Обратите внимание, что вы должны кодировать только основной текст, а не всю строку mailto; и вам не нужны пробелы до / после \n.
Лука

2
Мне понравился этот подход, вот jsfiddle, чтобы увидеть его в действии: jsfiddle.net/oligray/5uosngy4
Оливер Грей,

3
Вы также можете просто использовать% 0A для перевода строки, поэтому вам не нужно делать это из JavaScript.
Дирк Бур

58

Я использовал это, и похоже, что он работает с outlook, не используя html, но вы можете форматировать текст по крайней мере, когда тело добавляется как вывод.

<a href="mailto:email@address.com?subject=Hello world&body=Line one%0DLine two">Email me</a>

2
Так что "% 0D" это перевод строки. Что такое эквивалентный код закодированной вкладки?
wide_eyed_pupil

3
% 0D - это новая строка ctrl-m, вкладка ctrl-i% 09. Посмотрите на диаграмму ASCII, как это [ asciitable.com/index/asciifull.gif] . Управляющие символы от 1 до 31. @wide_eyed_pupil
Джим Бергман

2
Кажется, что любая подпись удаляется при этом.
Валентин Деспа

% 0A будет \ n
Клемен Тушар

3
Это не тело HTML!
Хлоя

46

Это не совсем то, что вам нужно, но возможно с помощью современного 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);
})();

8
Теперь это
Грег

2
Отличная идея, но, к сведению, на последней Apple Mail этот файл откроется, но не будет редактируемым / отправляемым, он действует как отправленная запись электронной почты
pmarreck

1
В Apple Mail (11.2), открыв файл .eml, вы можете выбрать Message / Send Again из меню (shift-cmd-D), чтобы перевести письмо в режим редактирования.
Джефф Кольер

31

Некоторые вещи возможны, но не все, скажем, например, вы хотите разрывы строк вместо <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>                        

7
Это не HTML ... все еще текст.
Брэд

нет, если вы форматируете свою электронную почту, используя $ mailheader. = "Content-type: text / html; charset = iso-8859-1 \ r \ n";
Стивен Кауфман

12
@StephenKaufman - вы не тот, кто отправляет электронное письмо, а клиенты, которые нажимают на ссылку. Это означает, что вы не знаете, как настроен почтовый клиент. Вы не знаете, как установлены его заголовки. Это будет работать на некоторых почтовых клиентах, а не на других.
Narxx

1
спасибо, это был второй лучший вариант для меня, если я не могу сделать HTML, то, по крайней мере, я могу сделать возврат каретки. меня устраивает.
Хэмиш

16

Стоит отметить, что в Safari на iPhone, по крайней мере, вставьте основные теги HTML, такие как <b>, <i>и <img>(которые в идеале не следует больше использовать в других обстоятельствах, предпочитая CSS) в параметр body вmailto: действительно кажется работа - они соблюдаются в почтовом клиенте. Я не провел исчерпывающее тестирование, чтобы увидеть, поддерживается ли это другими мобильными или настольными браузерными / почтовыми клиентами Также сомнительно, действительно ли это соответствует стандартам. Может быть полезно, если вы строите для этой платформы, хотя.

Как отмечалось в других ответах, вы должны также использовать encodeURIComponent на всем теле, прежде чем встраивать его в mailto:ссылку.


Да, это прекрасно работает для добавления простых жирных, курсивных тегов - в любом случае, в iOS.
Толстяк

На iOS я не могу отправить правильное письмо с <img src = 'mybase64' /> - в Gmail я вижу base64 внутри моего сообщения.
Виталий Зданевич


0

У меня та же проблема, касающаяся обмена HTML. Я делаю ниже HTML работу для меня. Замените <на <&> на>.

<a href="mailto:?subject=link Share&body=&lt;a href='www.google.com'&gt;google&lt;/a&gt;">Email</a>

Примечание: это работает только в Ubuntu. Это не будет работать в Windows.


-1

Любой может попробовать следующее (функция mailto принимает только открытый текст, но здесь я покажу, как использовать свойства внутреннего текста HTML и как добавить привязку в качестве параметров mailto body):

//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

-3

Можно ввести значения Unicode для вставки новых строк (т. Е. \u0009), Но HTML-теги имеют различную степень поддержки и их следует избегать.


Используя наш сайт, вы подтверждаете, что прочитали и поняли нашу Политику в отношении файлов cookie и Политику конфиденциальности.
Licensed under cc by-sa 3.0 with attribution required.