Html 提交按钮上的Mailto
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/12626940/
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
Mailto on submit button
提问by Pavel Shchegolevatykh
Is it possible to implement mailto:function on submit button like <input type="submit" />? I use ASP.NET MVC. Maybe there is some tricky controller action result to achieve this. Could you please help me?
是否可以mailto:在提交按钮上实现功能<input type="submit" />？我使用 ASP.NET MVC。也许有一些棘手的控制器动作结果来实现这一点。请你帮助我好吗？
P.S. I know that I can make anchor looks like a button.
PS我知道我可以让锚看起来像一个按钮。
回答by zzzzBov
In HTML you can specify a mailto:address in the <form>element's [action]attribute.
在 HTML 中，您可以mailto:在<form>元素的[action]属性中指定地址。
<form action="mailto:[email protected]" method="GET">
<input name="subject" type="text" />
<textarea name="body"></textarea>
<input type="submit" value="Send" />
</form>
What this will do is allow the user's email client to create an email prepopulated with the fields in the <form>.
这将允许用户的电子邮件客户端创建一封电子邮件，其中预先填充了<form>.
What this will notdo is send an email.
这不会做的是发送电子邮件。
回答by Greald Henstra
This seems to work fine:
这似乎工作正常：
<button onclick="location.href='mailto:[email protected]';">send mail</button>
回答by Mihir Parmar
What you need to do is use the onchangeevent listener in the form and change the hrefattribute of the send button according to the context of the mail:
您需要做的是使用onchange表单中的事件侦听器，并href根据邮件的上下文更改发送按钮的属性：
<form id="form" onchange="mail(this)">
<label>Name</label>
<div class="row margin-bottom-20">
<div class="col-md-6 col-md-offset-0">
<input class="form-control" name="name" type="text">
</div>
</div>
<label>Email <span class="color-red">*</span></label>
<div class="row margin-bottom-20">
<div class="col-md-6 col-md-offset-0">
<input class="form-control" name="email" type="text">
</div>
</div>
<label>Date of visit/departure </label>
<div class="row margin-bottom-20">
<div class="col-md-3 col-md-offset-0">
<input class="form-control w8em" name="adate" type="text">
<script>
datePickerController.createDatePicker({
// Associate the text input to a DD/MM/YYYY date format
formElements: {
"adate": "%d/%m/%Y"
}
});
</script>
</div>
<div class="col-md-3 col-md-offset-0">
<input class="form-control" name="ddate" type="date">
</div>
</div>
<label>No. of people travelling with</label>
<div class="row margin-bottom-20">
<div class="col-md-3 col-md-offset-0">
<input class="form-control" placeholder="Adults" min=1 name="adult" type="number">
</div>
<div class="col-md-3 col-md-offset-0">
<input class="form-control" placeholder="Children" min=0 name="childeren" type="number">
</div>
</div>
<label>Cities you want to visit</label><br />
<div class="checkbox-inline">
<label><input type="checkbox" name="city" value="Cassablanca">Cassablanca</label>
</div>
<div class="checkbox-inline">
<label><input type="checkbox" name="city" value="Fez">Fez</label>
</div>
<div class="checkbox-inline">
<label><input type="checkbox" name="city" value="Tangier">Tangier</label>
</div>
<div class="checkbox-inline">
<label><input type="checkbox" name="city" value="Marrakech">Marrakech</label>
</div>
<div class="checkbox-inline">
<label><input type="checkbox" name="city" value="Rabat">Rabat</label>
</div>
<div class="row margin-bottom-20">
<div class="col-md-8 col-md-offset-0">
<textarea rows="4" placeholder="Activities Intersted in" name="activities" class="form-control"></textarea>
</div>
</div>
<div class="row margin-bottom-20">
<div class="col-md-8 col-md-offset-0">
<textarea rows="6" class="form-control" name="comment" placeholder="Comment"></textarea>
</div>
</div>
<p><a id="send" class="btn btn-primary">Create Message</a></p>
</form>
JavaScript
JavaScript
function mail(form) {
var name = form.name.value;
var city = "";
var adate = form.adate.value;
var ddate = form.ddate.value;
var activities = form.activities.value;
var adult = form.adult.value;
var child = form.childeren.value;
var comment = form.comment.value;
var warning = ""
for (i = 0; i < form.city.length; i++) {
if (form.city[i].checked)
city += " " + form.city[i].value;
}
var str = "mailto:[email protected]?subject=travel to morocco&body=";
if (name.length > 0) {
str += "Hi my name is " + name + ", ";
} else {
warning += "Name is required"
}
if (city.length > 0) {
str += "I am Intersted in visiting the following citis: " + city + ", ";
}
if (activities.length > 0) {
str += "I am Intersted in following activities: " + activities + ". "
}
if (adate.length > 0) {
str += "I will be ariving on " + adate;
}
if (ddate.length > 0) {
str += " And departing on " + ddate;
}
if (adult.length > 0) {
if (adult == 1 && child == null) {
str += ". I will be travelling alone"
} else if (adult > 1) {
str += ".We will have a group of " + adult + " adults ";
}
if (child == null) {
str += ".";
} else if (child > 1) {
str += "along with " + child + " children.";
} else if (child == 1) {
str += "along with a child.";
}
}
if (comment.length > 0) {
str += "%0D%0A" + comment + "."
}
if (warning.length > 0) {
alert(warning)
} else {
str += "%0D%0ARegards,%0D%0A" + name;
document.getElementById('send').href = str;
}
}
回答by garfunkel61
The full list of possible fields in the html based email-creating form:
基于 html 的电子邮件创建表单中可能字段的完整列表：
- subject
- cc
- bcc
- body
- 主题
- 抄送
- 密件抄送
- 身体
<form action="mailto:[email protected]" method="GET">
<input name="subject" type="text" /></br>
<input name="cc" type="email" /><br />
<input name="bcc" type="email" /><br />
<textarea name="body"></textarea><br />
<input type="submit" value="Send" />
</form>
回答by geekman
Or you can create a form with action:mailto
或者你可以创建一个带有 action:mailto 的表单
<form action="mailto:[email protected]">
check this out.
看一下这个。
http://webdesign.about.com/od/forms/a/aa072699mailto.htm
http://webdesign.about.com/od/forms/a/aa072699mailto.htm
But this actually submits a form via email.Is this what you wanted? You can also use just
但这实际上是通过电子邮件提交表单。这是您想要的吗？你也可以只使用
<button onclick="">and then some javascript with it to ahieve this.
<button onclick="">然后使用一些 javascript 来实现这一点。
And you can make a <a>look like button.
There can be a lot of ways to work this around. Do a little search.
你可以制作一个<a>看起来像按钮的东西。有很多方法可以解决这个问题。做一点搜索。
回答by Nancy
Just include "a" tag in "button" tag.
只需在“button”标签中包含“a”标签。
<button><a href="mailto:..."></a></button>
