web-dev-qa-db-fra.com

Ouvrez le lien href mailto dans un nouvel onglet/fenêtre

J'ai une image qui, quand je clique dessus, je veux créer un lien vers un mailto:

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

Cependant, une fois que l'utilisateur a cliqué dessus, il lancera l'option de courrier électronique pour choisir une application mailto, et une fois que je choisis, le lien mailto est ouvert dans l'onglet actuel. Cela entraînera l'utilisateur à quitter l'application.

Donc, je veux que la page à envoyer un email (par gmail, yahoo, etc) est soit ouverte dans un nouvel onglet ou dans une fenêtre. Une idée comment faire ça? J'ai essayé à la fois target = "_ newtab" et target = "_ blank" mais les deux ne fonctionnaient pas.

Toute aide sera très appréciée .. Merci ...

(La méthode jQuery est également acceptable s'il n'y a pas d'autre moyen, merci)

17
shennyL

mailto appelle le client de messagerie par défaut de l'utilisateur. Il n'ouvre aucune fenêtre ou onglet dans aucun cas. Si vous souhaitez utiliser une fenêtre ou un onglet, vous devez configurer un formulaire et autoriser le formulaire à s'ouvrir dans votre fenêtre/onglet. Bien sûr, vous devrez configurer le formulaire pour envoyer du courrier avec la méthode disponible sur votre serveur.

10
Scott

cette information est obsolète, je pense qu’il est maintenant possible de le faire, puisque Gmail et d’autres fonctionnent désormais via des liens de navigation. il y a cependant le problème que vous voudriez seulement qu'il s'ouvre dans un nouvel onglet s'il n'ouvre PAS dans un client de messagerie système, et s'ouvre dans un nouvel onglet s'il s'agit d'un client de messagerie Web, sinon, par exemple, les utilisateurs d'Outlook voient un onglet vide ce qui est désorientant, surtout depuis qu’ils sont des utilisateurs d’Outlook.

23
RedScourge

Vous n'avez pas besoin de Javascript/Jquery pour cela. Un lien standard fonctionne (sauf Firefox v30 + en raison d'un bogue, voir ci-dessous).

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

A partir de Firefox 30, ne fonctionne pas dans Firefox à cause d'un bug . Il s’ouvre dans le même onglet ET remplace l’historique afin que vous ne reveniez pas à la page où se trouvait le lien mailto:.

13
Costa

Je sais que c'est une vieille question, mais ce fil avait la meilleure série de réponses s'il était trouvé. J'ai modifié la réponse de Marcos ci-dessus pour fermer également l'onglet vide créé si le client dispose d'un gestionnaire de messagerie externe.

réponse de référence

JS (w\jQuery pour les gestionnaires d'événements)

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

2
Sampson Crowley

Variante 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('[email protected]', 'Subject', 'Body');event.preventDefault()">[email protected]</a>

Variante 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:[email protected]?subject=Subject&body=Body" onclick="mailto(this);event.preventDefault()">[email protected]</a>

Variante 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:[email protected]?subject=Subject&body=Body" id="mailto">[email protected]</a>

Variante 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:[email protected]?subject=Subject&body=Body" target="_blank">[email protected]</a>

Attribut cible HTML: https://www.w3schools.com/tags/att_a_target.asp

0
Botyk