我希望我的网站有能力发送电子邮件而不刷新页面。我想用Javascript。
<form action="javascript:sendMail();" name="pmForm" id="pmForm" method="post">
Enter Friend's Email:
<input name="pmSubject" id="pmSubject" type="text" maxlength="64" style="width:98%;" />
<input name="pmSubmit" type="submit" value="Invite" />
这是我想调用的函数,但我不确定把什么放入javascript函数。从我所做的研究中,我发现了一个使用mailto方法的示例,但我的理解是,它实际上并不直接从站点发送。
所以我的问题是,我可以在哪里找到什么放入JavaScript函数直接从网站发送电子邮件。
function sendMail() {
/* ...code here... */
}
我找不到一个能真正满足最初问题的答案。
Mandrill是不可取的,因为它是新的定价政策,加上它需要一个后端服务,如果你想保持你的凭证安全。
最好隐藏你的电子邮件,这样你就不会出现在任何列表中(mailto解决方案暴露了这个问题,对大多数用户来说不方便)。
仅仅为了发送一封电子邮件而设置sendMail或需要一个后端是很麻烦的。
我提供了一个简单的免费服务,允许您发出标准的HTTP POST请求来发送电子邮件。它叫做PostMail,你可以使用JavaScript或jQuery简单地发布一个表单。当你注册时,它为你提供代码,你可以复制和粘贴到你的网站。下面是一些例子:
JavaScript:
<form id="javascript_form">
<input type="text" name="subject" placeholder="Subject" />
<textarea name="text" placeholder="Message"></textarea>
<input type="submit" id="js_send" value="Send" />
</form>
<script>
//update this with your js_form selector
var form_id_js = "javascript_form";
var data_js = {
"access_token": "{your access token}" // sent after you sign up
};
function js_onSuccess() {
// remove this to avoid redirect
window.location = window.location.pathname + "?message=Email+Successfully+Sent%21&isError=0";
}
function js_onError(error) {
// remove this to avoid redirect
window.location = window.location.pathname + "?message=Email+could+not+be+sent.&isError=1";
}
var sendButton = document.getElementById("js_send");
function js_send() {
sendButton.value='Sending…';
sendButton.disabled=true;
var request = new XMLHttpRequest();
request.onreadystatechange = function() {
if (request.readyState == 4 && request.status == 200) {
js_onSuccess();
} else
if(request.readyState == 4) {
js_onError(request.response);
}
};
var subject = document.querySelector("#" + form_id_js + " [name='subject']").value;
var message = document.querySelector("#" + form_id_js + " [name='text']").value;
data_js['subject'] = subject;
data_js['text'] = message;
var params = toParams(data_js);
request.open("POST", "https://postmail.invotes.com/send", true);
request.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
request.send(params);
return false;
}
sendButton.onclick = js_send;
function toParams(data_js) {
var form_data = [];
for ( var key in data_js ) {
form_data.push(encodeURIComponent(key) + "=" + encodeURIComponent(data_js[key]));
}
return form_data.join("&");
}
var js_form = document.getElementById(form_id_js);
js_form.addEventListener("submit", function (e) {
e.preventDefault();
});
</script>
jQuery:
<form id="jquery_form">
<input type="text" name="subject" placeholder="Subject" />
<textarea name="text" placeholder="Message" ></textarea>
<input type="submit" name="send" value="Send" />
</form>
<script>
//update this with your $form selector
var form_id = "jquery_form";
var data = {
"access_token": "{your access token}" // sent after you sign up
};
function onSuccess() {
// remove this to avoid redirect
window.location = window.location.pathname + "?message=Email+Successfully+Sent%21&isError=0";
}
function onError(error) {
// remove this to avoid redirect
window.location = window.location.pathname + "?message=Email+could+not+be+sent.&isError=1";
}
var sendButton = $("#" + form_id + " [name='send']");
function send() {
sendButton.val('Sending…');
sendButton.prop('disabled',true);
var subject = $("#" + form_id + " [name='subject']").val();
var message = $("#" + form_id + " [name='text']").val();
data['subject'] = subject;
data['text'] = message;
$.post('https://postmail.invotes.com/send',
data,
onSuccess
).fail(onError);
return false;
}
sendButton.on('click', send);
var $form = $("#" + form_id);
$form.submit(function( event ) {
event.preventDefault();
});
</script>
再次坦白地说,我创建这个服务是因为我找不到合适的答案。
另一种从JavaScript发送电子邮件的方法是使用directtomx.com,如下所示;
Email = {
Send : function (to,from,subject,body,apikey)
{
if (apikey == undefined)
{
apikey = Email.apikey;
}
var nocache= Math.floor((Math.random() * 1000000) + 1);
var strUrl = "http://directtomx.azurewebsites.net/mx.asmx/Send?";
strUrl += "apikey=" + apikey;
strUrl += "&from=" + from;
strUrl += "&to=" + to;
strUrl += "&subject=" + encodeURIComponent(subject);
strUrl += "&body=" + encodeURIComponent(body);
strUrl += "&cachebuster=" + nocache;
Email.addScript(strUrl);
},
apikey : "",
addScript : function(src){
var s = document.createElement( 'link' );
s.setAttribute( 'rel', 'stylesheet' );
s.setAttribute( 'type', 'text/xml' );
s.setAttribute( 'href', src);
document.body.appendChild( s );
}
};
然后从页面中调用它,如下所示;
window.onload = function(){
Email.apikey = "-- Your api key ---";
Email.Send("to@domain.com","from@domain.com","Sent","Worked!");
}
你的问题没有一个直接的答案,因为我们不能只使用javascript发送电子邮件,但有一些方法可以使用javascript为我们发送电子邮件:
1)使用API并通过javascript调用API为我们发送电子邮件,例如https://www.emailjs.com说你可以在一些设置后使用下面的代码来调用他们的API:
var service_id = 'my_mandrill';
var template_id = 'feedback';
var template_params = {
name: 'John',
reply_email: 'john@doe.com',
message: 'This is awesome!'
};
emailjs.send(service_id,template_id,template_params);
2)创建一个后端代码来为你发送电子邮件,你可以使用任何后端框架来为你做这件事。
3)使用像这样的东西:
window.open('mailto:me@http://stackoverflow.com/');
这将打开你的电子邮件应用程序,这可能会进入阻止弹出在你的浏览器。
一般来说,发送电子邮件是一个服务器任务,所以应该在后端语言中完成,但我们可以使用javascript来收集所需的数据,并将其发送到服务器或api,我们也可以使用第三方应用程序,并通过浏览器使用javascript打开它们。