Html 将 <div> 用作按钮并在单击时触发 mailto

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/19639900/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-29 14:49:01  来源:igfitidea点击:

Use <div> as a button and trigger a mailto when it is clicked

javascripthtmlmailto

提问by divyanshm

I'm creating a custom button on my webpage which actually is a <div>, I want to trigger a mailto when the button is clicked. What is the best way out?

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

I've tried calling a javascript function using-onClick that looks like this -

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

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

But that opens a new tab in Chrome first, and then asks for the relevant app to send out the email. This experience is different from what we generally get when we simply do a <a href=mailto:.....>in HTML.

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

I can also create a new document element in the JS function, and simulate a click like this -

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

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

But i'm not too sure if that's the right way! Anyone has a better solution?

但我不太确定这是否是正确的方法!有人有更好的解决方案吗?

采纳答案by George

Use an anchor tag but change the display property to block:

使用锚标记但将显示属性更改为阻止:

HTML

HTML

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

CSS

CSS

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

回答by Tony

Try this, and tell me if works. If not, I will delete answer.

试试这个,然后告诉我是否有效。如果没有,我将删除答案。

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

回答by Chris Kempen

Extremely late to the party I know, but what about combining these answers into something simpler and more practical:

我知道参加聚会非常晚,但是如何将这些答案组合成更简单、更实用的东西:

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

回答by Yulimar

Try this function and html. It will open a new email client with.

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

<div onclick="doMail();">


function doMail() {

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

回答by Rick

This worked for me:

这对我有用:

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

@Tony has used the same approach just assignhas been added.

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

回答by Aurovrata

In order to obfuscate your email from SPAM bots what scan website for emails, you can do the follwing,

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

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

and instead of the 'Send E-Mail' text you can place an an image of your actual email address (screenshot) to make it move obvious.

而不是“发送电子邮件”文本,您可以放置​​一张您的实际电子邮件地址的图像(屏幕截图),以使其清晰可见。

回答by Kiran KV

Try this :

尝试这个 :

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

回答by Vinay Pratap Singh

<div onclick="mailtoperformingFunction('inner');" id="divbutton">

<script type="text/javascript">
function mailtoperformingFunction()
{
}
</script>