使用<div>作为按钮并在单击时触发mailto

Question

我正在我的网页上创建一个自定义按钮实际上是一个<div>,我想在单击按钮时触发mailto.什么是最好的出路？

我试过用-onClick调用一个javascript函数,看起来像这样 -

function foo(){
    window.open("mailto:xyz@abc.com");
}

但是,这会首先在Chrome中打开一个新标签,然后要求相关应用发送电子邮件.这种体验与我们<a href=mailto:.....>在HTML中简单地进行操作时的体验不同.

我还可以在JS函数中创建一个新的文档元素,并模拟这样的点击 -

function sendEmail() {
    var mail = 'mailto:contact@test.com';
    var a = document.createElement('a');
    a.href = mail;
    a.click();
};

但我不太确定这是不是正确的方法!谁有更好的解决方案？

Answer 1

试试这个,告诉我是否有效.如果没有,我会删除答案.

<script>
function sendEmail() 
{
    window.location = "mailto:xyz@abc.com";
}
</script>
<div onclick="sendEmail();">Send e-mail</div>

Answer 2

使用锚标记,但将display属性更改为block:

HTML

<a class="mailto" href="mailto:contact@test.com">Mail</a>

CSS

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

Answer 3

我知道这个派对非常晚,但是将这些答案组合成更简单,更实用的东西呢:

<div class="button" onclick="location.href='mailto:xyz@abc.com';">Send E-Mail</div>

Answer 4

这对我有用：

<script>
function sendEmail() 
{
    window.location.assign("mailto:xyz@abc.com");
}
</script>
<div onclick="sendEmail();">Send e-mail</div>

@Tony 使用了刚刚assign添加的相同方法。

Answer 5

试试这个功能和 html。它将打开一个新的电子邮件客户端。

<div onclick="doMail();">


function doMail() {

    var email ="xyz@abc.com";
    location.href = "mailto:"+email;
}

Answer 6

为了混淆来自扫描网站电子邮件的垃圾邮件机器人的电子邮件，您可以执行以下操作，

<div class="button" onclick="location.href='mail'+'to:xyz'+'@'+abc'+'.'+'com';">Send E-Mail</div>

而不是“发送电子邮件”文本，您可以放置​​您的实际电子邮件地址的图像（屏幕截图）以使其更加明显。