HTML 103 互動式網頁 助教:黃毓瑩
1. 表單的建立-1 啟動 Microsoft Frontpage,插入【表單】
1. 表單的建立-2 一直按【Enter】,將 『提交』與『重新設定』往下推。 將游標移至表單最上方,key in 《姓名:》,執行右圖的指令
1. 表單的建立-3 上述步驟後的結果會如下圖所示。
1. 表單的建立-4 點選方才建立的單行方字方塊,按滑鼠右鍵 點選【表單欄位內容】
1. 表單的建立-5 將預設的“T1”改為“name”,以方便與其他欄位的區別 【字元寬度】之調整,可以變更欄位顯示寬度的大小
1. 表單的建立-6 將FrontPage的呈現方式由【一般】切換成【HTML】
1. 表單的建立-6 HTML語言如下: <p>姓名:<input type="text" name="name" size="20"></p> <p>電子信箱:<input type="text" name="email" size="20"></p> 規則為: <INPUT TYPE=text NAME=欄位名稱 SIZE=欄位顯示寬度>
1. 表單的建立-7 整個文字方塊的建立如下: <HTML> <HEAD> <TITLE> 互動式網頁 - 範例一 </TITLE> </HEAD> <BODY> <FORM> 姓名:<INPUT TYPE=text NAME=name> <BR> 電子信箱:<INPUT TYPE=text NAME=email> <BR> </FORM> </BODY> </HTML>
1. 表單的建立-8 上述的說明乃是“表單的欄位”,是要讓人填資料用的。 另外還有兩種“決策型欄位”, <INPUT TYPE=submit VALUE=按鈕的顯示文字> <INPUT TYPE=reset VALUE=按鈕的顯示文字> 例如: <p> <input type="submit" value="提交" name="B1"><input type="reset" value="重新設定" name="B2"></p>
1. 表單的建立-9 做完後,存成“xxx. html”,並將該檔案放入你的web資料夾中
2. PHP (Personal Home Page) PHP 開發之時,即是以處理網頁之表單為目標,是一種伺服器端的 Script 語言。
2. PHP -2 用 PHP 進行表單資料處理 <?php $name=$_POST['name']; $email=$_POST['email']; echo "<HTML> \n"; echo "<HEAD> \n"; echo "<TITLE> 中山企管 管理資訊系統 網路商店 $name 的留言</TITLE> \n"; echo "<META HTTP-EQUIV=\"Content-Type\" CONTENT=\"text/html; charset=big5\"> \n"; echo "</HEAD> \n\n"; echo "<BODY> \n"; echo " $name 謝謝您!     我們已經接到您的留言。 <BR> <BR> \n"; echo " 您所留的資料是:<BR> \n"; echo " 姓名: $name <BR> \n"; echo " 電子信箱: $email <BR> \n"; echo "</BODY> </HTML> \n"; ?>
2. PHP -3 開啟記事本,將上述文字複製貼上,並另存新檔為“xxx.php”(注意,此處要更改檔案類型), xxx 的意思是它必需和你前面做的“xxx. html”檔名是相同的
2. PHP -4 關於字串的處理:回到FrontPage下的xxx. html 將xxx.html與 xxx.php一起上傳至server <FORM METHOD=post ACTION=xxx.php > 姓名:<INPUT TYPE=text NAME=name> <BR> 電子信箱:<INPUT TYPE=text NAME=email> <BR> <INPUT TYPE=submit VALUE=留言> <INPUT TYPE=reset VALUE=清除> </FORM> 將xxx.html與 xxx.php一起上傳至server
完整範例(1)
完整範例(2)-系統回應
2. PHP -5 將資料email給自己:接續剛才的php語言 echo "</BODY> </HTML> \n"; $mailto = “kuo@bm.nsysu.edu.tw”; (商店主的e-mail) $subject = “網路商店 顧客的留言”; (e-mail的主旨) $message = "姓名: $name \n"; $message .= "電子信箱: $email \n"; (注意 這裡的運算子是 .= (dot equal)) $sender = "From: \"$name\" $email "; mail($mailto, $subject, $message, $sender); ?>
3. 參考範本-1 http://www.e-quilters.com/contact_us.php
3. 參考範本-2 http://www.moooe-shop.com.tw/contact/contact.html
3. 參考範本-3 http://www.netbuilder.com.tw/html/modules/tinycontent/index.php?id=17