web-dev-qa-db-ja.com

hTML本文を含むmailtoリンク

私はHTML文書の中にいくつかのmailtoリンクを持っています。

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

hrefのmailto:部分にHTML形式の本文を挿入できますか？

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

IOSでは（2016）、単純なイタリック体の太字の書式設定のために<i>タグと<b>タグを追加することはまったく問題ありません。

htmlemailmailto
272
GxG

RFC 6068 でわかるように、これはまったく不可能です。

特別な<hfname> "body"は、関連する<hfvalue>がメッセージの本文であることを示します。 "body"フィールド値は、メッセージの最初のテキスト/プレーンボディ部分の内容を含むことを意図しています。 "body"疑似ヘッダフィールドは、一般的なMIMEボディ用ではなく、主に自動処理用の短いテキストメッセージ（メーリングリスト用の "subscribe"メッセージなど）の生成を意図しています。

398
Alfonso Marin

いいえ、できません。

94
Quentin

HTMLを使用してEメール本文をフォーマットすることはできませんが、以前に提案されたように改行を追加することができます。

あなたがjavascriptを使うことができるならば、「encodeURIComponent（）」は以下のように役に立つかもしれません...

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

私はこれを使用しました、そしてそれはhtmlを使用しないで、Outlookで動作するようですが、少なくともボディが出力として加えられるとき、あなたはテキストを改行でフォーマットすることができます。

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

それはあなたが望むものではありませんが、クライアント上でEMLファイルを作成し、それをユーザーのファイルシステムにストリーミングするために現代のJavaScriptを使用することは可能です。

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>

ジャバスクリプト

(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);
})();
27
Matthew

<br />use %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>
23
Stephen Kaufman

IPhoneのSafariでは、少なくとも、<b>、<i>、<img>などの基本的なHTMLタグ（他の状況では使用しないことをお勧めします）をbodyパラメータに挿入することをお勧めします。 mailto:は機能するように見えます - それらは電子メールクライアント内で尊重されています。私はこれが他のモバイルまたはデスクトップブラウザ/ Eメールクライアントコンボでサポートされているかどうかを確認するための徹底的なテストをしていません。これが本当に規格に準拠しているかどうかも疑わしいです。ただし、そのプラットフォーム用に構築している場合は便利でしょう。

他の回答が指摘したように、あなたはそれをmailto:リンクに埋め込む前に本体全体でencodeURIComponentを使うべきです。

16
Andrew Ferrier

誰でも次のことを試すことができます（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
0
Miguel Ballén