web-dev-qa-db-fra.com

Utiliser <div> comme un bouton et déclencher un mailto quand il est cliqué

Je crée un bouton personnalisé sur ma page Web qui est en fait un <div>. Je souhaite déclencher un mailto lorsque vous cliquez sur le bouton. Quelle est la meilleure sortie?

J'ai essayé d'appeler une fonction javascript à l'aide de on-click qui ressemble à ceci - 

function foo(){
    window.open("mailto:[email protected]");
}

Mais cela ouvre d'abord un nouvel onglet dans Chrome, puis demande à l'application correspondante d'envoyer l'e-mail. Cette expérience est différente de ce que nous obtenons généralement lorsque nous faisons simplement un <a href=mailto:.....> en HTML.

Je peux également créer un nouvel élément de document dans la fonction JS et simuler un clic comme celui-ci - 

function sendEmail() {
    var mail = 'mailto:[email protected]';
    var a = document.createElement('a');
    a.href = mail;
    a.click();
};

Mais je ne suis pas trop sûr que ce soit le cas! Quelqu'un a une meilleure solution?

javascripthtmlmailto
14
divyanshm

Utilisez une balise d'ancrage mais modifiez la propriété display pour bloquer:

HTML

<a class="mailto" href="mailto:[email protected]">Mail</a>

CSS

.mailto{
  display:block;
  width:100px;
  height:20px;
}
11
George

Essayez ceci et dites-moi si ça marche. Sinon, je vais supprimer la réponse.

<script>
function sendEmail() 
{
    window.location = "mailto:[email protected]";
}
</script>
<div onclick="sendEmail();">Send e-mail</div>
18
Tony

Extrêmement tard pour le parti que je connais, mais qu’en est-il de combiner ces réponses en quelque chose de plus simple et plus pratique:

<div class="button" onclick="location.href='mailto:[email protected]';">Send E-Mail</div>
12
Chris Kempen

Essayez cette fonction et HTML. Il ouvrira un nouveau client de messagerie avec.

<div onclick="doMail();">


function doMail() {

    var email ="[email protected]";
    location.href = "mailto:"+email;
}
4
userStack

Essaye ça :

<div class="button" href="javascript: void(0)" onclick="location.href='mailto:[email protected]';">Click to Send email</div>
0
Kiran KV
<div onclick="mailtoperformingFunction('inner');" id="divbutton">

<script type="text/javascript">
function mailtoperformingFunction()
{
}
</script>
0
Vinay Pratap Singh