Download presentation
Presentation is loading. Please wait.
1
HTML 103 互動式網頁
2
1. 表單的建立-1 啟動 Microsoft Frontpage，插入【表單】
3
1. 表單的建立-2 一直按【Enter】，將 『提交』與『重新設定』往下推。
將游標移至表單最上方，key in 《姓名：》，執行右圖的指令
4
1. 表單的建立-3 上述步驟後的結果會如下圖所示。
5
1. 表單的建立-4 點選方才建立的單行方字方塊，按滑鼠右鍵 點選【表單欄位內容】
6
1. 表單的建立-5 將預設的“T1”改為“name”，以方便與其他欄位的區別 【字元寬度】之調整，可以變更欄位顯示寬度的大小
7
1. 表單的建立-6 將FrontPage的呈現方式由【一般】切換成【HTML】
8
1. 表單的建立-6 HTML語言如下： <p>姓名：<input type="text" name="name" size="20"></p> <p>電子信箱：<input type="text" name=" " size="20"></p> 規則為： <INPUT TYPE=text NAME=欄位名稱 SIZE=欄位顯示寬度>
9
1. 表單的建立-7 整個文字方塊的建立如下： <HTML> <HEAD>
<TITLE> 互動式網頁 - 範例一 </TITLE> </HEAD> <BODY> <FORM> 姓名：<INPUT TYPE=text NAME=name> <BR> 電子信箱：<INPUT TYPE=text NAME= > <BR> </FORM> </BODY> </HTML>
10
1. 表單的建立-8 上述的說明乃是“表單的欄位”，是要讓人填資料用的。 另外還有兩種“決策型欄位”，
<INPUT TYPE=submit VALUE=按鈕的顯示文字> <INPUT TYPE=reset VALUE=按鈕的顯示文字> 例如： <p> <input type="submit" value="提交" name="B1"><input type="reset" value="重新設定" name="B2"></p>
11
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= > <BR> <INPUT TYPE=“submit” VALUE=留言> <INPUT TYPE=“reset” VALUE=清除> </FORM> 將xxx.html與 xxx.php一起上傳至server
12
1. 表單的建立-9 做完後，存成“xxx. html”，並將該檔案放入你的web資料夾中
13
完整範例 <html> <head>
<meta http-equiv="Content-Language" content="zh-tw"> <meta http-equiv="Content-Type" content="text/html; charset=big5"> <title>姓名</title> </head> <body> <form method="POST" action="xxx.php"> <!--webbot bot="SaveResults" U-File="_private/form_results.csv" S-Format="TEXT/CSV" S-Label-Fields="TRUE" startspan --><input TYPE="hidden" NAME="VTI-GROUP" VALUE="0"><!--webbot bot="SaveResults" i-checksum="43374" endspan --> <p>姓名:<input type="text" name="name" size="20"></p> <p> </p> <p> <input type="text" name=" " size="20"></p> <p><input type="submit" value="送出" name="B1"><input type="reset" value="重新設定" name="B2"></p> </form> </body> </html>
14
2. PHP (Personal Home Page)
PHP 開發之時，即是以處理網頁之表單為目標，是一種伺服器端的 Script 語言。
15
2. PHP -2 用 PHP 進行表單資料處理 <?php $name=$_POST['name'];
$ =$_POST[' ']; 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 " 電子信箱： $ <BR> \n"; echo "</BODY> </HTML> \n"; ?>
![2. PHP -2 用 PHP 進行表單資料處理 < php $name=$_POST[ name ];](http://slidesplayer.com/slide/16192324/95/images/15/2.+PHP+-2+%E7%94%A8+PHP+%E9%80%B2%E8%A1%8C%E8%A1%A8%E5%96%AE%E8%B3%87%E6%96%99%E8%99%95%E7%90%86+%3C+php+%24name%3D%24_POST%5B+name+%5D%3B.jpg "$ =$_POST[ ]; 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 電子信箱： $ <BR> \n ; echo </BODY> </HTML> \n ; >")
16
完整範例(1)
17
完整範例(2)－系統回應
18
2. PHP -5 將資料email給自己：接續剛才的php語言
echo "</BODY> </HTML> \n"; $mailto = $subject = “網路商店 顧客的留言”; （ 的主旨） $message = "姓名： $name \n"; $message .= "電子信箱： $ \n"; （注意 這裡的運算子是 .= (dot equal)） $sender = "From: \"$name\" $ "; mail($mailto, $subject, $message, $sender); ?>
19
完整範例 <?php $name=$_POST['name']; $ =$_POST[' ']; 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 " 電子信箱： $ <BR> \n"; echo "</BODY> </HTML> \n"; $mailto = $subject = "網路商店 顧客的留言"; $message = "姓名： $name \n"; $message .= "電子信箱： $ \n"; $message .= "謝謝！\n"; $sender = "From: \"$name\" $ "; mail($mailto, $subject, $message, $sender); ?>
20
2. PHP -3 開啟記事本，將上述文字複製貼上，並另存新檔為“xxx.php”（注意，此處要更改檔案類型）， xxx 的意思是它必需和你前面做的“xxx. html”檔名是相同的
Similar presentations
