Creating email link with dynamically generated body with html5 & javascript

Question

Am trying to create a link to create an email to send information to the user, the body of which needs to be filled with data generated by a javascript function, and hope that someone can help.

Idealy, if I could substitute the 'body_blurb' below, with a string returned from a javascript function called at the time of clicking that'd be perfect.

<A HREF="mailto:you@yourdomain.com?subject=Data&body=body_blurb">e-mail data</a>

Appreciate your time

You could do that relatively easily, but what event is binding body_blurb to that anchor? Are the users clicking on something prior to the mail anchor? — Christopher Marshall, Jan 26 '12 at 06:04
Do you realize that `mailto:` often doesn't work, particularly when users are using a web-based email service like Yahoo, GMail, Hotmail, etc... and thus there is no local email client to field the mailto: and act on it? — jfriend00, Jan 26 '12 at 06:06

score 7 · Accepted Answer · answered Jan 26 '12 at 06:10

7

I just assigned an id to the link here, but you could create something more generic if you wanted. Once you have an onclick handler created you can access the url with href. Set this to whatever you want.

http://jsfiddle.net/f3ZZL/1

var link = document.getElementById('email');
link.onclick = function() {
    this.href = "mailto:you@yourdomain.com?subject=Data&body=";
    this.href += getBody();
};

function getBody() {
    return 'HelloWorld';
}

answered Jan 26 '12 at 06:10

mrtsherman

39,342
23
87
111

Perfect - exactly what I was after. By way of further explanation, I'm creating a simple engineering calculation number cruncher to be accssed via mobile browsers. The user would enter their variables, crunch the numbers and get an output. I'd like to be able to give them the option of sending themselves the data set of inputs & outputs. – Mark Burgoyne Jan 26 '12 at 06:21

talves · Answer 2 · 2020-08-19T00:17:26.793

1

Here is the no-spam method

var link = document.getElementById('email');

link.onclick = function() {
    var name = "you";
    var domain = "yourdomain.com";
    var linker = "mailto:" + name + '@' + domain + "?subject=Data&body=";
    linker += getBody();
    link.setAttribute("href", linker);
};

function getBody() {
    return 'HelloWorld';
}

On Fiddle

edited Aug 19 '20 at 00:17

answered Dec 11 '13 at 21:45

talves

13,993
5
40
63

score 0 · Answer 3 · answered Jan 26 '12 at 06:04

0

You don't actually need to set the href value. What you're really trying to do is send the browser to a mailto: URL: the href is just a means to that end.

Leave the href blank and make the link have an onClick handler. In the onClick, feed the browser the mailto: URL (after you build it using your variable). Presto, done.

answered Jan 26 '12 at 06:04

Borealid

95,191
9
106
122

1

Hmmm, so you could use `location.href = mailto: ...`? – mrtsherman Jan 26 '12 at 06:12

Creating email link with dynamically generated body with html5 & javascript

3 Answers3

Linked