DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> HTML基礎知識 >> HTML和Xhtml >> 談html mailto(電子郵件)實際應用
談html mailto(電子郵件)實際應用
編輯:HTML和Xhtml     
大家知道,mailto是網頁設計制作中的一個非常實用的html標簽,許多擁有個人網頁的朋友都喜歡在網站的醒目位置處寫上自己的電子郵件地址,這樣網頁浏覽者一旦用鼠標單擊一下由mailto組成的超級連接後,就能自動打開當前計算機系統中默認的電子郵件客戶端軟件,例如OutLook Express以及Foxmail等。

但是由於各操作系統和郵件客戶端對 mailto 事件連接的處理不一致,所以在實際應用的時候需要注意;

1.基本語法

<a href=mailto:[email protected]>send email</a>

或者  

<form action="mailto:[email protected]">

</form>

參數列表:

to 收信人(多個之間用;分割) suject 主題 cc 抄送 bcc 暗抄送 body 內容(部分郵件客戶端支持html格式語句)

參數傳遞方式同頁面之間傳遞值一樣,可以使用鏈接字符串,也可以用form

鏈接字符串

<a href="mailto:[email protected]?subject=testtitle&[email protected]&body=this is body">send mail</a>

form方式

復制代碼代碼如下:
<form name='sendmail' action='mailto:[email protected]'>
<input name='cc' type='text' value='[email protected]'>
<input name='subject' type='text' value='testtitle'>
<input name='body' type='text' value='this is body'>
</form>

2.郵件客戶端區別

上面是mailto的簡單語法應用;但在實際應用中 根據浏覽器設置的浏覽器客戶端不同,會有不用效果;

尤其是在body 內容包含html 格式的語句時候,這時候需要注意;

outlook 是對body 的html 語句原樣展示(對body的html 進行 escape 後也是同樣的無效),那麼我們在outlook mailto 時候想body 裡面的語句換行怎麼辦 呢?<br/> 是沒有效果的。。需要用 %0D 字符作為換行符號;

foxmail 是會對body的html 語句展示其html 對應的效果;

當然也可以換另一種方式,實現類型mailto的客戶端發送郵件:

復制代碼代碼如下:
function SendMail(filePath) {
var path = location.href.substring(0, location.href.lastIndexOf("/")) + filePath;
var outlookApp = new ActiveXObject("Outlook.Application");
var nameSpace = outlookApp.getNameSpace("MAPI");
var mailItem = outlookApp.CreateItem(0);
var mailto = "[email protected] ";
var mailBody= "<HTML><BODY><DIV><FONT color=‘red’>test this is body html</FONT></DIV></BODY></HTML>";
mailItem.Subject = "test title";
mailItem.To = mailto;
mailItem.HTMLBody = mailBody;
if (path != "") {
mailItem.Attachments.Add(path);
}
mailItem.Display(0);
mailItem = null;
nameSpace = null;
outlookApp = null;
}

但是這個有個很大的缺點是:僅僅支持outlook 客戶端,需要對Internet選項進行配置,”對沒有標記為安全的ActiveX控件進行初始化和腳本運行“要啟用。

其中調用mailItem的Attachments.Add是向郵件中添加附件,沒有附件的時候就可以把filePath這個參數刪掉。

如果需要添加抄送對象,可以調用mailItem.Cc,若是需要添加一個暗送對象可以調用mailItem.Bcc方法。
XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved