好用的轉寄好友JavaScript程式─智邦公益電子報─台灣最大公益電子報發行中心

第三階段【網頁製作系列報導】電子報【各種程式選用】

您現在剛好有空檔嗎？告訴您免費參加[行銷實務應用班]職業訓練的好消息

實用程式彙報

第一篇
好用的轉寄好友JavaScript程式

壹、介紹理由：
⊙想藉由訪客將貴網站(頁)推薦給更多人嗎？
⊙您找不到一隻易於安裝又好用的推薦好友程式嗎？
⊙您煩惱自己網站沒有支援(CGI、ASP、PHP.....)程式功能，而無法安裝此類程式嗎？
⊙當然最主要它是完全免費的。
⊙看完本報導，保證您一定會使用。

貳、功能說明：
⊙當您輸入收件者信箱按決定送出後，會主動將您的預設寄件者電子信箱帶進來。
⊙您也可以按左邊收件者，由聯絡簿找到您要寄送的對象便可。
⊙此程式修改極為容易，用任何網頁編輯器打開tellafriend.js檔，修改內容中文字部份即可。
⊙設有表單欄位、按鈕訊息顯示功能及JavaScript有效信箱檢查功能。

參、安裝步驟一：⊙找到您的網頁適當處，在<BODY>及</BODY>任何地方，插入以下程式碼：
<FORM NAME="eMailer" ACTION="" METHOD=POST>
<INPUT TYPE=TEXT NAME="email" VALUE="Enter Address Here" SIZE=19 MAXLENGTH=26>
<INPUT TYPE=BUTTON NAME="submit" VALUE="決定送出" onClick="mailThisUrl();">
</FORM>

肆、補充說明：
<FORM...>....</FORM> 　 //表單開始與結束宣告
<FORM .... ACTION="" METHOD=POST> 　 //指定程式連結位置(此處不需用到後端程式，所以空白)與送出模式
<NPUT TYPE=TEXT....> 　 //表單欄位顯示為(文字)輸入空格
<NPUT NAME="eMailer" 及 NAME="submit"....> 　 //表單欄位命名，必須與語程式內一致
<NPUT VALUE="Enter Address Here"....> 　 //顯示於欄位內的文字值(您可以任意修改為自己要的內容)
<NPUT VALUE="決定送出"....> 　 //顯示於按鈕上的文字值(您可以任意修改為自己要的內容)
<NPUT SIZE=19 MAXLENGTH=26> 　 //表單欄位寬度與最大輸入數字
<NPUT .... onFocus="this.value=''"....> 　 //焦點(Focus)事件，當滑鼠觸擊表單欄位時，自動清空預設欄位值
<NPUT TYPE=BUTTON....> 　 //表單欄位顯示為(按鈕)形狀樣式，注意此處 TYPE=BUTTON 而非 TYPE=SUBMIT 喔
<INPUT .... onClick="mailThisUrl();"> 　 //點選(Click)事件，表單呼叫外部 JavaScript 程式，必須與語程式內一致
⊙初學者想瞭解更多HTML、JavaScript....教學說明，請參考第一、二期電子報。
⊙進階者可以叫出本篇

，於表單欄位及按鈕處，加入onMouseOver & onMouseOut滑鼠事件訊息顯示功能。

伍、安裝步驟二：⊙在該網頁<HEAD>與</HEAD>間，插入以下程式碼：
<SCRIPT SRC="tellafriend.js"></SCRIPT> 　 //這是 JavaScript 程式外部連結碼，網頁會自動去找到它
⊙這個tellafriend.js名稱可以自定；此處特別注意存放位置及路徑就好。
⊙為了您的方便，特別提供tellafriend.js檔

給您下載。

陸、修改JS檔：
⊙用任何網頁編輯器(建議使用電腦內的記事本(Notepade)打開tellafriend.js檔，修改內容中文字部份即可。
⊙我在裡面以用註解//方式詳細說明了，此處就不再詳述喔。

柒、補充說明
⊙tellafriend.js程式可以有兩種選擇：
01.本文主體內顯示該網頁的標題<TITLE>...</TITLE>：
window.location = "mailto:"+document.eMailer.email.value+"?subject="+initialsubj+"&body="+document.title+" "+u;
⊙使用這個時： initialsubj 的值可以改為="嗨！我是您的好友某某人，介紹下面這個[轉寄好友JavaScript程式]網頁您"
⊙否則您的朋友不知道到底是甚麼內容，還以為是廣告信喔！
02.本文主體內顯示您輸入的 initialmsg 值：
window.location = "mailto:"+document.eMailer.email.value+"?subject="+initialsubj+"&body="+initialmsg
03.選用其中一個，將不要的加上註解//符號，他就不會顯示出來了。

捌、注意事項：
⊙此程式 NC 及 IE 瀏覽器都可使用。
⊙此程式只適合有網站的人，您不可用電腦內的網頁來寄此信，因為他會以絕對路徑顯示。
⊙表單開始<FORM...>..與結束..</FORM>之宣告，不可錯置或遺漏。
⊙修改tellafriend.js程式不可任意段行，初學者先練習修改中文字部份吧。

玖、何謂絕對路徑：
⊙如果您不知到甚麼是電腦內或網路上的絕對路徑、相對路徑？
⊙請參考第一期電子報貳、網頁運用技巧 => 網頁運用技巧【07】網頁鏈結種類研討。

拾、結論與建議：
⊕本報每篇報導都花上8小時以上搜集、整理及撰稿，絕對值得初學者或想徹底學會HTML語法網友永久保存。
⊕本電子報第三階段報導資料，將繼續每隔30日發表一次，以嘉惠更多想學會HTML網友，歡迎訂閱！
⊕本報導資料取自網頁研習室教學會員檔案資料，內附更多範例介紹，歡迎進一步研習。
⊕強烈建議您學會HTML語法，她真的簡單易學，懂了她您就能駕馭她，不要再用所見即所得軟體了。
⊕本報導內容或資料，因限人力，非本報教學會員，不接受任何疑惑解答，敬請見諒。

第三階段93.09.05.發行第002期前期：成立第三期電子報及觀看捲動文字原始碼