Use <div> as a button and trigger a mailto when it is clicked
Solution 1
Use an anchor tag but change the display property to block:
HTML
<a class="mailto" href="mailto:[email protected]">Mail</a>
CSS
.mailto{
display:block;
width:100px;
height:20px;
}
Solution 2
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>
Solution 3
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>
Solution 4
This worked for me:
<script>
function sendEmail()
{
window.location.assign("mailto:[email protected]");
}
</script>
<div onclick="sendEmail();">Send e-mail</div>
@Tony has used the same approach just assign
has been added.
Solution 5
In order to obfuscate your email from SPAM bots that scan website for emails, you can do the following,
<div class="button" onclick="location.href='mail'+'to:xyz'+'@'+abc'+'.'+'com';">Send E-Mail</div>
and instead of the 'Send E-Mail' text you can place an image of your actual email address (screenshot) to make it more obvious.
Comments
-
divyanshm over 2 years
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?