liên kết mail với cơ thể HTML

319

Tôi có một vài mailtoliên kết trong một tài liệu HTML.

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

Tôi có thể chèn phần thân được định dạng HTML vào mailto:phần hrefkhông?

<a href="mailto:me@me.com?subject=Me&body=<b>ME</b>">Mail me</a>

Lưu ý rằng (2016) trong iOS, việc thêm <i>và <b>gắn thẻ cho định dạng in nghiêng đơn giản, in đậm là hoàn toàn tốt .

html  email  mailto 
— GxG
nguồn
1
Có chính xác điều tương tự trong tâm trí và nghiên cứu nó trong một thời gian. Tôi đã cố gắng để có một điều khiển từ xa <img> được nhúng vào nội dung thư. Hướng dẫn mailto cần được mã hóa URL để nó hoạt động. Kết quả với thunderbird là phần thân HTML xuất hiện theo đúng nghĩa đen, với tất cả các hướng dẫn <img> và tất cả. Tôi đoán đây là vấn đề an toàn ở chim sấm sét và hầu hết các ứng dụng thư khách - họ phân tích nội dung thư đến để nó không làm gì đáng ngờ.
— Hannes R.
4
Điều tốt nhất tôi có thể tìm thấy đến từ trang này, zaposphere.com/html-email-links-code .. Phía dưới cùng đưa ra một danh sách: "Các tùy chỉnh thú vị khác mà hầu hết các trang web khác không đề cập đến !!" Giúp tôi rất nhiều.
— Stu Andrew
Bạn có thể đặt từng phần của một email với văn bản cơ bản. Liên quan đến những hạn chế mà định dạng html là không thể, đây là một công cụ tôi đã xây dựng để tùy chỉnh các trường khác nhau trong một thư đến đơn giản: mailto.now.sh
— Dawson B

Câu trả lời:

428

Như bạn có thể thấy trong RFC 6068 , điều này hoàn toàn không thể:

<hfname>"Cơ thể" đặc biệt chỉ ra rằng liên kết <hfvalue> là cơ thể của thông điệp. Giá trị trường "nội dung" được dự định chứa nội dung cho phần văn bản / phần thân đơn giản đầu tiên của tin nhắn. Trường tiêu đề giả "cơ thể" chủ yếu dành cho việc tạo các tin nhắn văn bản ngắn để xử lý tự động (chẳng hạn như tin nhắn "đăng ký" cho danh sách gửi thư), không dành cho các cơ quan MIME chung.

— Alfonso Marin
nguồn
4
@JoeBlow Trả lời vẫn đúng. RFC 6068 đã lỗi thời 2368 vẫn nói rằng cơ thể là văn bản thuần túy.
— Markus Laire
8
Nếu bạn thất vọng vì câu trả lời này, vui lòng tiếp tục đọc: stackoverflow.com/a/46699855/256272 (tệp tl; dr .eml)
— Joe
95

Không. Điều này là không thể.

— Quentin
nguồn
1
Không đúng hoàn toàn. Mặc dù hỗ trợ rất khan hiếm, các câu trả lời khác đã chỉ ra rằng một số HTML giới hạn có thể có trong iOS và sự kết hợp giữa IE + ActiveX + Outlook (urgh, yuck).
— Simon East
89

Mặc dù KHÔNG thể sử dụng HTML để định dạng nội dung email của bạn, bạn có thể thêm ngắt dòng như đã được đề xuất trước đây.

Nếu bạn có thể sử dụng javascript thì "encodeURIComponent ()" có thể được sử dụng như dưới đây ...

var formattedBody = "FirstLine \n Second Line \n Third Line";
var mailToLink = "mailto:x@y.com?body=" + encodeURIComponent(formattedBody);
window.location.href = mailToLink;
— Oliver Pearmain
nguồn
1
Khách hàng email có thể chạy Javascript nhúng không? OP cho biết đây là email không phải là trang web có liên kết mailto :.
— wide_eyed_pupil
cảm ơn, trong Rails, bạn có thể sử dụng raw("text \n more text \n\n\t")chức năng đóng gói văn bản và chuyển đổi này thành dấu ngắt dòng và tab cho phần thân email
— FireDragon
Điều này làm việc cho tôi, gửi từ Chrome "mailto" tới Outlook. Lưu ý rằng bạn chỉ phải mã hóa văn bản cơ thể, không phải toàn bộ chuỗi mailto; và bạn không cần khoảng trắng trước / sau \n.
— Lu-ca
2
Tôi thích cách tiếp cận này, đây là một jsfiddle để xem nó hoạt động: jsfiddle.net/oligray/5uosngy4
— Oliver Gray
3
Bạn cũng có thể chỉ sử dụng% 0A cho ngắt dòng, vì vậy bạn không cần phải làm điều đó từ JavaScript.
— Dirk Boer
58

Tôi đã sử dụng cái này và nó dường như hoạt động với triển vọng, không sử dụng html nhưng bạn có thể định dạng văn bản với các ngắt dòng ít nhất là khi phần thân được thêm làm đầu ra.

<a href="mailto:email@address.com?subject=Hello world&body=Line one%0DLine two">Email me</a>
— Andy
nguồn
2
Vì vậy, "% 0D" là dòng mới. Mã của tab được mã hóa tương đương là gì?
— wide_eyed_pupil
3
% 0D là một dòng mới là ctrl-m, một tab là ctrl-i là% 09. Hãy xem biểu đồ ASCII như thế này [ asciitable.com/index/asciifull.gif] . Các ký tự điều khiển là từ 1 đến 31. @ Worldwide_eyed_pupil
— Jim Bergman
2
Bất kỳ chữ ký dường như được loại bỏ khi làm điều này.
— Valentin Despa
% 0A sẽ là \ n
— Klemen Tušar
3
Đó không phải là một cơ thể HTML!
— Chloe
46

Đó không phải là những gì bạn muốn, nhưng có thể sử dụng javascript hiện đại để tạo tệp EML trên máy khách và truyền phát đến hệ thống tệp của người dùng, sẽ mở một email phong phú chứa HTML trong chương trình thư của họ, chẳng hạn như Outlook:

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

Đây là một jsfiddle của một email chứa hình ảnh và bảng: 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);
})();
— Matthew
nguồn
8
Bây giờ đó là một ý tưởng lạ mắt
— Greg
2
Ý tưởng gọn gàng, nhưng chỉ dành cho bản ghi, trên Apple Mail mới nhất, tệp này sẽ mở nhưng sẽ không thể chỉnh sửa / gửi được, nó hoạt động như một bản ghi email đã gửi
— pmarreck
1
Với Apple Mail (11.2), khi bạn đã mở tệp .eml, bạn có thể chọn Tin nhắn / Gửi lại từ menu (shift-cmd-D) để đặt email ở chế độ chỉnh sửa.
— Jeff Collier
31

Một số điều có thể, nhưng không phải tất cả, ví dụ như bạn muốn ngắt dòng, thay vì sử <br />dụng%0D%0A

Thí dụ: 

<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>
— Stephen Kaufman
nguồn
7
Đó không phải là HTML ... vẫn là văn bản.
— Brad
không nếu bạn định dạng email của mình bằng $ mailheader. = "Kiểu nội dung: text / html; charset = iso-8859-1 \ r \ n";
— Stephen Kaufman
12
@StephenKaufman - bạn không phải là người gửi email mà là khách hàng nhấp vào liên kết. Có nghĩa là bạn không biết cách ứng dụng email được đặt. Bạn không biết làm thế nào tiêu đề của nó được thiết lập. Điều này sẽ hoạt động trên một số khách hàng email và sẽ không làm việc trên những người khác.
— Narxx
1
cảm ơn, đây là lựa chọn tốt thứ hai đối với tôi, nếu tôi không thể làm html, thì ít nhất tôi cũng có thể thực hiện trả lại vận chuyển. tốt bởi tôi
— hamish
16

Đó là giá trị chỉ ra rằng trên Safari trên iPhone, ít nhất, chèn các thẻ HTML cơ bản như <b>, <i>và <img>(mà lý tưởng bạn không nên sử dụng trong những trường hợp khác nữa dù sao, thích CSS) vào các tham số cơ thể trong mailto:không xuất hiện để công việc - họ được vinh danh trong ứng dụng email. Tôi chưa thực hiện kiểm tra toàn diện để xem liệu điều này có được hỗ trợ bởi các combo trình duyệt / email máy tính để bàn hoặc máy tính để bàn khác không. Nó cũng không rõ liệu điều này có thực sự tuân thủ tiêu chuẩn hay không. Có thể hữu ích nếu bạn đang xây dựng cho nền tảng đó, mặc dù.

Như các phản hồi khác đã lưu ý, bạn cũng nên sử dụng encodeURIComponent trên toàn bộ cơ thể trước khi nhúng nó vào mailto:liên kết.

— Andrew Ferrier
nguồn
Vâng, nó hoạt động hoàn hảo để thêm các thẻ in nghiêng đơn giản, in nghiêng - trong iOS.
— Fattie
Trên iOS, tôi không thể gửi email chính xác bằng <img src = 'mybase64' /> - trong Gmail tôi thấy base64 trong tin nhắn của mình.
— Vitaly Zdanevich
0

Tôi có cùng một vấn đề liên quan đến việc chia sẻ html. Tôi làm công việc dưới đây cho tôi. Thay thế <bằng <&> bằng>.

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

Lưu ý: Nó chỉ hoạt động trong Ubuntu. Nó sẽ không hoạt động trong windows.

— Rajan Kashiyani
nguồn
-1

Bất kỳ ai cũng có thể thử các cách sau (chức năng mailto chỉ chấp nhận văn bản gốc nhưng ở đây tôi trình bày cách sử dụng các thuộc tính innertext HTML và cách thêm một neo làm thông số cơ thể 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
— Miguel Ballén
nguồn
-3

Có thể nhập các giá trị unicode để chèn dòng mới (ví dụ \u0009:) nhưng các thẻ HTML có mức độ hỗ trợ khác nhau và nên tránh.

— Ryan Dunphy
nguồn
-11

Tôi đã làm việc theo cách này:

var newLine = escape("\n");
var body = "Hello" + newLine +"World";

Đầu ra sẽ là:

Hello
World
— Ravi Solanki
nguồn
Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookie và Chính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.