Open the href mailto link in new tab / window

Question

I have an image which when click, I want to link to a mailto:

 <a id="mailto" href="mailto:[email protected]" target="_newtab" >
        <img src="@Url.Content("~/Content/HomePage/email.png")" alt="email" /></a>

However, currently once its clicked, it will launch the email option to choose a mailto application, and once i choose, the mailto link is open in the current tab. This will cause user to leave the application.

So, I want the page to sent email (by gmail, yahoo, etc ) is either open in new tab or in a window. Any idea how to do this? I tried both target="_newtab" and target="_blank" but both didn't work.

Any help will be much appreciated.. Thanks...

(jQuery method is also acceptable if there is no other way, thanks)

Solution 1

mailto calls the users default email client. It does not open a window or tab in any instance. If you want to use a window or tab you need to configure a form and allow the form to open in your window/tab. Of course, you'll have to configure the form to send mail with whatever method is available on your server.

Solution 2

this information is outdated, now it is possible to do so i believe, since gmail and others now work via browser links. there is however the problem that you would only want it to open in a new tab if NOT opening in a system mail client, and open in a new tab if it is a webmail client, otherwise for example Outlook users see a blank tab appear, which is disorienting, especially since they are Outlook users.

Solution 3

You don't need Javascript/Jquery for this. A standard link works (except Firefox v30+ due to a bug, see below).

<a href="mailto:[email protected]" target="_blank">

As of Firefox 30, does not work in Firefox due to a bug. It opens in the same tab AND replaces history so hitting back will not bring you back to the page where the mailto: link was.

Solution 4

This answer is based on this answer Open the href mailto link in new tab / window.

Right now, new browsers support some web mail interfaces (Like Gmail, Yahoo Mail, AoL, etc.).

So we can simply open a new window (Support older browser, new browsers just will open a new tab) and add a fallback (In case of non-javascript user) using preventDefault and default link redirection.

http://www.w3.org/TR/DOM-Level-2-Events/events.html#Events-flow-cancelation

https://developer.mozilla.org/es/docs/DOM/event.preventDefault

https://developer.mozilla.org/en-US/docs/Web/API/Window.open

Like so:

<a onClick="javascript:window.open('mailto:[email protected]', 'mail');event.preventDefault()" href="mailto:[email protected]">Send a e-mail</a>

http://jsfiddle.net/cNUNP/

Credit to https://stackoverflow.com/a/9880404/1107020

Guess that's all.

Greetings, Marcos.

Solution 5

I know this is an old question, but this thread had the best set of answers if found. I modified Marcos's Answer above to also close the blank tab that is created if the client has an external mail handler

reference answer

JS (w\ jQuery for event handlers)

$(document).on('click', 'a[href^=mailto]', function(e) {
  var checkClose, checkLoaded, event, href, i, len, loadEvents, results, t, wndw;
  e.preventDefault();
  href = this.href;
  wndw = window.open(href, 'mail');
  checkClose = function() {
    console.log('checkClose');
    try {
      wndw.location.href;
      return wndw.close();
    } catch (error) {
      return console.log('webmail');
    }
  };
  t = setTimeout(checkClose, 5000);
  try {
    checkLoaded = function() {
      console.log('loaded');
      clearTimeout(t);
      return t = setTimeout(checkClose, 2000);
    };
    wndw.onload = checkLoaded;
    loadEvents = ["DomContentLoaded", "load", "beforeunload", "unload"];
    results = [];
    for (i = 0, len = loadEvents.length; i < len; i++) {
      event = loadEvents[i];
      results.push(wndw.addEventListener(event, checkLoaded));
    }
    return results;
  } catch (error) {
    return checkLoaded();
  }
});

jsfiddle

View more solutions

Comments

[Chris Hanson]

This may have been true in 2011, but it is not true anymore. You can open mail clients such as Gmail in a new tab using target="_blank". Unfortunately, that is not sufficient since it will launch a blank tab for folks using stand alone clients.

[Scott]

And how do you open Outlook (the most popular email client) in a tab? It's always been possible open web-based email services in a window or tab. But web-based email services are not the majority of email clients.

[Marcos Eusebi]

My awnser is based in your post, I just added the code. But you deserve the credit.

[OldDogLearningNewPerlTricks]

This is correct. I am trying to find a solution. _blank does exactly what Costa says. How can we circumvent and open the gmail page in a new tab or possibly a pop up javascript window?

[Leonidas]

Just for the history it is 8 months later and the bug still exists.

[Costa]

2016 update: bug is still not fixed. Was originally opened in 2011 so doubtful this will be fixed unless the bug gets a ton of upvotes (hint, hint): bugzilla.mozilla.org/show_bug.cgi?id=646552

[Matt MacLeod]

This answer is outdated, some mail clients open in tabs such as gmail or inbox

[Scott]

@MattMacLeod the #1 email client in use is Outlook. As stated, while you certainly can set a link to open a new tab or window... that will not work with the #1 client today. This answer is not outdated.

[Matt MacLeod]

@scott "mailto calls the users default email client. It does not open a window or tab in any instance." Is that part outdated?

[Scott]

@MattMacLeod No. It is not outdated. Mailto still merely calls the users default email client.

[Costa]

2017 update: bug is still not fixed. I will most likely never be fixed without lots of upvotes: bugzilla.mozilla.org/show_bug.cgi?id=646552

[Sampson Crowley]

This is being used in production at my work without issues for google chrome, I haven't checked other browsers

[Sampson Crowley]

confirmed latest firefox. I'm on linux, so can't test IE

[CertainPerformance]

Inline handlers are quite bad practice - consider attaching handlers properly using Javascript instead.

[Botyk]

I made another option

[Henrik]

Thanks @Sampson-Crowley! I can confirm this to be working in IE (11) and Chrome (68). With Chrome setup correctly as default and with account it opens as web client. With email client setup instead it works as well. In some scenario I could get an empty tab (cannot recreate) but that closed automatically as expected from code. Also tested in Android that goes into Gmail there. Thanks for sharing!

[Lonnie Best]

Up-voted for the line "especially since they are Outlook users".

[Costa]

2021 update: This 10-year old Firefox bug is still not fixed. There are some very recent discussions in the bug tracker so maybe hope is not lost.

[Noitidart]

Man this bug is still open. Thanks for sharing the link to bugzilla. I was confused why it wouldn't open in new tab despite target blank.