JavaScriptで、タイトル、内容、To、Cc等をセットしてメーラーを立ち上げたい場合があります。
iPhoneなどiOSでは、 location.href ではうまく立ち上がりません。PCのブラウザでもiPhoneでも動作させるには、 window.open を使います。
HTMLフォーム例
<form name="form_name">
<input type="submit" value="送信" onclick="func_sendmail();">
<label>To<input type="text" name="to" placeholder="aaa.bbb@ccc.dd"></label><br>
<label>Cc<input type="text" name="cc" placeholder="ml.aaa@bbb.cc; ml.ddd@eee.ff"></label><br>
<label>件名<input type="text" name="subject" placeholder="[勤怠連絡] テレワーク開始"></label><br>
<label>本文<textarea name="body"></textarea></label>
</form>
<form name="form_name"> の名前は一意にしておきます。
HTMLのフォームから情報を取得し、値をセットしてメーラーを立ち上げる
var fm = document.forms[`form_name`];
var to = encodeURIComponent(fm.to.value);
var cc = '?Cc=' + encodeURIComponent(fm.cc.value);
var sj = '&Subject=' + encodeURIComponent(fm.subject.value);
var body = fm.body.value.replace(/\n/g, '\r\n');
body = '&body=' + encodeURIComponent(body);
ml = 'mailto:' + to + cc + sj + body;
window.open(ml, "_blank"); // PCでもスマホでもOK!
document.forms は、HTMLのフォームの名前を指定して情報を取得します。
次に、to.value で name="to" の値を取得し、
mailto に渡すために encodeURIComponent でURIエンコードします。
cc 、 sj （タイトル）、 body も同様です。
body で、 replace(/\n/g, '\r\n') しているのは、 mailto の改行の法則に変換するためです。
mailto は通常Toの宛先だけですが、Ccや本文などを付ける場合は、 ? で指定し、複数ある場合は & でつなげてゆきます。
最後に、HTMLの mailto にセットし、それを window.open でメーラーを起動します。
location.href を使う方法もありますが、iPhoneなどiOSでは setTimeout などで遅延しないとうまく起動しません。またAndroidやPCではそのまま呼ばないと起動しないので場合分けが必要になり面倒です。ですのでwindow.open を使うのがシンプルで良いと思います。
参考
2023/10/09