Rectangle 27 19

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, espeically since they are Outlook users.

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

jquery - Open the href mailto link in new tab / window - Stack Overflo...

jquery razor href target mailto
Rectangle 27 11

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.

<a onClick="javascript:window.open('mailto:mail@domain.com', 'mail');event.preventDefault()" href="mailto:mail@domain.com">Send a e-mail</a>

Didn't work for me in Firefox 40.

the fiddle worked in FF43

jquery - Open the href mailto link in new tab / window - Stack Overflo...

jquery razor href target mailto
Rectangle 27 6

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.

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.

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.

@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.

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

jquery - Open the href mailto link in new tab / window - Stack Overflo...

jquery razor href target mailto
Rectangle 27 9

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

<a href="mailto:example@example.com" 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.

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?

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

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

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

jquery - Open the href mailto link in new tab / window - Stack Overflo...

jquery razor href target mailto
Rectangle 27 1

I received a request for implementing this in ownCloud Contacts and though I also think it's a bit hackish, there doesn't seem to be another way of detecting if the mailto handler is set to a webmail address.

NOTE: jQuery is needed for this example, but it can probably be rewritten to strict javascript.

To avoid having to use data-mailtoor other tricks, you can instead intercept the handler:

$(window).on('click', function(event) {
    if(!$(event.target).is('a[href^="mailto"]')) {
        return;
    }

    // I strip the 'mailto' because I use the same function in other places
    mailTo($(event.target).attr('href').substr(7));
    // Both are needed to avoid triggering other event handlers
    event.stopPropagation();
    event.preventDefault();
});
mailTo()

I decreased the timeout to 500. Works For Me, lets see what the users say when it's pushed ;)

If you want to avoid opening a new tab/window you can use an iframe. It will require an extra request, but is less annoying if you don't use webmail yourself. This wasn't feasible for ownCloud because per default the Content-Security-Policy is very strict, and injecting "foreign" URLs into an iframe isn't allowed (not tested much):

var mailTo = function(url) {
    var url = 'mailto:' + data.url, $if;
    try {
        $if = $('<iframe />')
            .css({width: 0, height: 0, display: 'none'})
            .appendTo($('body'))
            .attr('src', url);
    } catch(e) {
        console.log('There was an error opening a mail composer.', e);
    }
    setTimeout(function() {
        try {

            if($if.attr('src') !== url 
                    && $if.attr('src').substr(0, 6) !== 'about:'
            ) {
                window.open($if.attr('src'), 'Mailer');
            }
        } catch(e) {
            console.log('There was an error opening a mail composer.', e);
        }
        $if.remove();
    }, 500);

}

Works great on computers, but fails on iOS 9 in Safari when you want to use the default mail client. Opens and closes a blank page even when I set the timeout to 10000 just to let their bloated animations run.

javascript - How to open mailto links in new tab for users that have g...

javascript google-chrome gmail handler mailto
Rectangle 27 1

I received a request for implementing this in ownCloud Contacts and though I also think it's a bit hackish, there doesn't seem to be another way of detecting if the mailto handler is set to a webmail address.

NOTE: jQuery is needed for this example, but it can probably be rewritten to strict javascript.

To avoid having to use data-mailtoor other tricks, you can instead intercept the handler:

$(window).on('click', function(event) {
    if(!$(event.target).is('a[href^="mailto"]')) {
        return;
    }

    // I strip the 'mailto' because I use the same function in other places
    mailTo($(event.target).attr('href').substr(7));
    // Both are needed to avoid triggering other event handlers
    event.stopPropagation();
    event.preventDefault();
});
mailTo()

I decreased the timeout to 500. Works For Me, lets see what the users say when it's pushed ;)

If you want to avoid opening a new tab/window you can use an iframe. It will require an extra request, but is less annoying if you don't use webmail yourself. This wasn't feasible for ownCloud because per default the Content-Security-Policy is very strict, and injecting "foreign" URLs into an iframe isn't allowed (not tested much):

var mailTo = function(url) {
    var url = 'mailto:' + data.url, $if;
    try {
        $if = $('<iframe />')
            .css({width: 0, height: 0, display: 'none'})
            .appendTo($('body'))
            .attr('src', url);
    } catch(e) {
        console.log('There was an error opening a mail composer.', e);
    }
    setTimeout(function() {
        try {

            if($if.attr('src') !== url 
                    && $if.attr('src').substr(0, 6) !== 'about:'
            ) {
                window.open($if.attr('src'), 'Mailer');
            }
        } catch(e) {
            console.log('There was an error opening a mail composer.', e);
        }
        $if.remove();
    }, 500);

}

Works great on computers, but fails on iOS 9 in Safari when you want to use the default mail client. Opens and closes a blank page even when I set the timeout to 10000 just to let their bloated animations run.

javascript - How to open mailto links in new tab for users that have g...

javascript google-chrome gmail handler mailto
Rectangle 27 0

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.

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.

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.

jquery - Open the href mailto link in new tab / window - Stack Overflo...

jquery razor href target mailto
Rectangle 27 0

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

<a href="mailto:example@example.com" 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.

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?

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

jquery - Open the href mailto link in new tab / window - Stack Overflo...

jquery razor href target mailto
Rectangle 27 0

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, espeically since they are Outlook users.

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

jquery - Open the href mailto link in new tab / window - Stack Overflo...

jquery razor href target mailto
Rectangle 27 0

Have you tried 'middle-click' ( "Open in new tab" ) ? It works for me

Anyway I've found a pseudo solution that seems to work in FF 25/ Chrome 35

1.- Set up your link something like this: ( substitute [ and ] by < and > )

[a href="javascript:void()"
 class="mailToLink" 
data-mail="mailaddr@domain.com"]mailaddr@domain.com [/a]

2.- Using javascript ( with jquery in the example) setup an onlclick event like:

$('.mailToLink').on('click', function(){
        mailto=$(this).data('mail');
        w=window.open('','_blank','',true);
        w.location.href='mailto:'+mailto;
        w.focus();
    });

This opens a blank new window/tab and later changes its location, so the mail protocol handler is unable toto act until the new window is already opened

Not tested with Local mail client ( Outlook et al.)

jquery - Open the href mailto link in new tab / window - Stack Overflo...

jquery razor href target mailto
Rectangle 27 0

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.

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.

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.

jquery - Open the href mailto link in new tab / window - Stack Overflo...

jquery razor href target mailto
Rectangle 27 0

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.

<a onClick="javascript:window.open('mailto:mail@domain.com', 'mail');event.preventDefault()" href="mailto:mail@domain.com">Send a e-mail</a>

jquery - Open the href mailto link in new tab / window - Stack Overflo...

jquery razor href target mailto
Rectangle 27 0

Have you tried 'middle-click' ( "Open in new tab" ) ? It works for me

Anyway I've found a pseudo solution that seems to work in FF 25/ Chrome 35

1.- Set up your link something like this: ( substitute [ and ] by < and > )

[a href="javascript:void()"
 class="mailToLink" 
data-mail="mailaddr@domain.com"]mailaddr@domain.com [/a]

2.- Using javascript ( with jquery in the example) setup an onlclick event like:

$('.mailToLink').on('click', function(){
        mailto=$(this).data('mail');
        w=window.open('','_blank','',true);
        w.location.href='mailto:'+mailto;
        w.focus();
    });

This opens a blank new window/tab and later changes its location, so the mail protocol handler is unable toto act until the new window is already opened

Not tested with Local mail client ( Outlook et al.)

jquery - Open the href mailto link in new tab / window - Stack Overflo...

jquery razor href target mailto
Rectangle 27 0

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

<a href="mailto:example@example.com" 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.

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?

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

jquery - Open the href mailto link in new tab / window - Stack Overflo...

jquery razor href target mailto
Rectangle 27 0

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.

<a onClick="javascript:window.open('mailto:mail@domain.com', 'mail');event.preventDefault()" href="mailto:mail@domain.com">Send a e-mail</a>

jquery - Open the href mailto link in new tab / window - Stack Overflo...

jquery razor href target mailto
Rectangle 27 0

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, espeically since they are Outlook users.

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

jquery - Open the href mailto link in new tab / window - Stack Overflo...

jquery razor href target mailto
Rectangle 27 -1

<a href="/mailto.html" target="_blank">Mail</a>
<meta HTTP-EQUIV="REFRESH" content="0; url=mailto:who@website.com">

If nothing pops up click.....<a href="mailto:who@website.com">Mail!</a>

_blank opens a new tab/window and the metatag does the rest. link as fallback offcourse.

jquery - Open the href mailto link in new tab / window - Stack Overflo...

jquery razor href target mailto
Rectangle 27 -1

Have you tried 'middle-click' ( "Open in new tab" ) ? It works for me

Anyway I've found a pseudo solution that seems to work in FF 25/ Chrome 35

1.- Set up your link something like this: ( substitute [ and ] by < and > )

[a href="javascript:void()"
 class="mailToLink" 
data-mail="mailaddr@domain.com"]mailaddr@domain.com [/a]

2.- Using javascript ( with jquery in the example) setup an onlclick event like:

$('.mailToLink').on('click', function(){
        mailto=$(this).data('mail');
        w=window.open('','_blank','',true);
        w.location.href='mailto:'+mailto;
        w.focus();
    });

This opens a blank new window/tab and later changes its location, so the mail protocol handler is unable toto act until the new window is already opened

Not tested with Local mail client ( Outlook et al.)

jquery - Open the href mailto link in new tab / window - Stack Overflo...

jquery razor href target mailto