Use <div> as a button and trigger a mailto when it is clicked

Question

I'm creating a custom button on my webpage which actually is a <div>, I want to trigger a mailto when the button is clicked. What is the best way out?

I've tried calling a javascript function using-onClick that looks like this -

function foo(){     window.open("mailto:[email protected]"); } 

But that opens a new tab in Chrome first, and then asks for the relevant app to send out the email. This experience is different from what we generally get when we simply do a <a href=mailto:.....> in HTML.

I can also create a new document element in the JS function, and simulate a click like this -

function sendEmail() {     var mail = 'mailto:[email protected]';     var a = document.createElement('a');     a.href = mail;     a.click(); }; 

But i'm not too sure if that's the right way! Anyone has a better solution?

Answer 1

Try this, and tell me if works. (If not, I will delete answer.)

<script> function sendEmail()  {     window.location = "mailto:[email protected]"; } </script> <div onclick="sendEmail();">Send e-mail</div> 

It is possible to pass the parameters subject and body, but I think that it is not possible to format the text:

<a href='mailto:[email protected]?subject=Me&body=Hello!'>EMAIL</a> 

Answer 2

Extremely late to the party I know, but what about combining these answers into something simpler and more practical:

<div class="button" onclick="location.href='mailto:[email protected]';">Send E-Mail</div>