Home » Html » mailto using javascript

mailto using javascript

Posted by: admin November 29, 2017 Leave a comment

Questions:

I want to open a new outlook mail template with the ‘To address’ whenever a user clicks an image. I have return my code in a html page(linked with the image), whenever it loads the javascript should open a new mail template. But the functionality is not working. Kindly let me know what is wrong in my code.

body onLoad="redirect()"

script language="JavaScript"

function redirect() 

      var email = "[email protected]"
      var mailto_link = 'mailto:' + email
      window = window.open(mailto_link, 'emailWindow')
      if (window && window.open && !window.closed)         
          window.close()
Answers:

No need for jQuery. And it isn’t necessary to open a new window. Protocols which doesn’t return HTTP data to the browser (mailto:, irc://, magnet:, ftp:// (<- it depends how it is implemented, normally the browser has an FTP client built in)) can be queried in the same window without losing the current content. In your case:

function redirect()
{
    window.location.href = "mailto:[email protected]";
}
<body onload="javascript: redirect();">

Or just directly

<body onload="javascript: window.location.href='mailto:[email protected]';">

Questions:
Answers:

Please find the code in jsFiddle. It uses jQuery to modify the href of the link. You can use any other library in its place. It should work.

HTML

<a id="emailLnk" href="#">
    <img src="http://ssl.gstatic.com/gb/images/j_e6a6aca6.png">
</a>

JS

$(document).ready(function() {
    $("#emailLnk").attr('href',"mailto:[email protected]");
});​

UPDATE

Another code sample, if the id is known only during the click event

$(document).ready(function() {
    $("#emailLnk").click(function()
     {
         alert('h');
         document.location.href = "mailto:[email protected]";
     });
});​

Questions:
Answers:

I’ve simply used this javascript code (using jquery but it’s not strictly necessary) :

    $( "#button" ).on( "click", function(event) {
         $(this).attr('href', 'mailto:[email protected]?subject=hello');
    });

When users click on the link, we replace the href attribute of the clicked element.

Be careful don’t prevent the default comportment (event.preventDefault), we must let do it because we have just replaced the href where to go

I think robots can’t see it, the address is protected from spams.

Questions:
Answers:

You can use the simple mailto, see below for the simple markup.

<a href="mailto:[email protected]">Click here to mail</a>

Once clicked, it will open your Outlook or whatever email client you have set.