在新标签/窗口中打开href mailto链接

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

我有一个图像,当点击,我想链接到mailto:

 <a id="mailto" href="mailto:[e-mail]" 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.

但是,当前单击它后,它将启动电子邮件选项以选择mailto应用程序,一旦我选择,mailto链接将在当前选项卡中打开。这将导致用户离开应用程序。

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.

因此,我希望页面发送电子邮件(通过gmail,yahoo等)在新标签页或窗口中打开。知道怎么做吗?我尝试了target =“_ newtab”和target =“_ blank”,但两者都没有用。

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

任何帮助将不胜感激..谢谢......

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

(如果没有其他方法,jQuery方法也可以接受,谢谢)

8 个解决方案

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

mailto调用用户默认的电子邮件客户端。它不会在任何实例中打开窗口或选项卡。如果要使用窗口或选项卡,则需要配置表单并允许在窗口/选项卡中打开表单。当然,您必须配置表单以使用服务器上可用的任何方法发送邮件。

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

这个信息已经过时了,现在我可以这样做,我相信,因为gmail和其他人现在通过浏览器链接工作。但问题是,如果不在系统邮件客户端中打开,您只希望在新选项卡中打开它,如果它是Webmail客户端,则在新选项卡中打开,否则例如Outlook用户看到一个空白选项卡出现,这是令人迷茫的,特别是因为他们是Outlook用户。

#3

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

这个答案基于这个答案在新标签/窗口中打开href mailto链接。

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

目前,新浏览器支持一些Web邮件界面(如Gmail,Yahoo Mail,AoL等)。

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.

所以我们可以简单地打开一个新窗口(支持旧浏览器,新浏览器只会打开一个新选项卡)并使用preventDefault和默认链接重定向添加后备(如果是非JavaScript用户)。

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:[e-mail]', 'mail');event.preventDefault()" href="mailto:[e-mail]">Send a e-mail</a>

发送电子邮件< / A>

http://jsfiddle.net/cNUNP/

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

感谢https://*.com/a/9880404/1107020

Guess that's all.

猜猜就是这样。

Greetings, Marcos.

#4

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

你不需要Javascript / Jquery。标准链接有效(Firefox v30 +除外,因为有bug,见下文)。

<a href="mailto:[e-mail]" 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.

从Firefox 30开始,由于存在错误,因此无法在Firefox中运行。它在相同的选项卡中打开并替换历史记录,因此回击将不会将您带回到mailto:link所在的页面。

#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

我知道这是一个老问题,但是如果找到这个帖子的答案最好。我修改了上面的Marcos答案,也关闭了客户端有外部邮件处理程序时创建的空白选项卡

reference answer

JS (w\ jQuery for event handlers)

JS(用于事件处理程序的w \ jQuery)

$(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

#6

Variant 1 (JavaScript):

变体1(JavaScript):

<script>
// Open mailto links in a new tab
function mailto(email, subject, body) {
    var url;
    url = 'mailto:' + email;
    url += '?subject=' + subject;
    url += '&body=' + body;
    window.open(url);
}
</script>

<a href="#" onclick="mailto('[e-mail]', 'Subject', 'Body');event.preventDefault()">[e-mail]</a>

Variant 2 (JavaScript):

变体2(JavaScript):

<script>
// Open mailto links in a new tab
function mailto(th) {
    var url = th.getAttribute('href');
    window.open(url);
}
</script>

<a href="mailto:[e-mail]?subject=Subject&body=Body" onclick="mailto(this);event.preventDefault()">[e-mail]</a>

Variant 3 (jQuery):

变体3(jQuery):

<script>
// Open mailto links in a new tab
$('#mailto').click(function (e) {
    e.preventDefault();
    var url = $(this).attr('href');
    window.open(url);
});
</script>

<a href="mailto:[e-mail]?subject=Subject&body=Body" id="mailto">[e-mail]</a>

Variant 4 (jQuery):

变体4(jQuery):

<script>
// Open mailto links in a new tab
$("a[href^='mailto:']").click(function(e) {
    e.preventDefault();
    var href = $(this).attr('href');
    var target = $(this).attr('target');
    window.open(href, target ? target : '_self');
});
</script>

<a href="mailto:[e-mail]?subject=Subject&body=Body" target="_blank">[e-mail]</a>

HTML target Attribute: https://www.w3schools.com/tags/att_a_target.asp

HTML目标属性:https://www.w3schools.com/tags/att_a_target.asp

#7

There is a cheap html-hack to this problem.....

这个问题有一个便宜的html-hack .....

The link on one page...

一页上的链接......

<a href="/mailto.html" target="_blank">Mail</a>

On mailto.html....

<meta HTTP-EQUIV="REFRESH" content="0; url=mailto:[e-mail]">

If nothing pops up click.....<a href="mailto:[e-mail]">Mail!</a>

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

_blank打开一个新的选项卡/窗口,其余的是metatag。链接作为后备的幕后。

#8

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

您是否尝试过“中键点击”(“在新标签中打开”)?这个对我有用

(http://forums.mozillazine.org/viewtopic.php?f=7&t=1842595)

although it seems particularly strange to ask user to Middle click

虽然要求用户点击中间点似乎特别奇怪

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

无论如何,我发现了一个伪解决方案似乎适用于FF 25 / Chrome 35

1.- Set up your link something like this:

1.-设置这样的链接:

<a href="javascript:void()"
 class="mailToLink" 
data-mail="[e-mail]">[e-mail] </a>

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

2.-使用javascript(在示例中使用jquery)设置onlclick事件,如:

    $('.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.)

没有使用本地邮件客户端测试(Outlook等人)