Microsoft PowerPoint - P766Ch09.ppt

Size: px

Start display at page:

Download "Microsoft PowerPoint - P766Ch09.ppt"

秽蒲
5 years ago
Views:

1 PHP5&MySQL 程式設計第 9 章在網頁之間傳遞資訊

2 9-1 蒐集網頁上的資訊建立表單一決定要蒐集的資訊二建立表單三撰寫表單處理程式

3 單行文字方塊多行文字方塊選擇鈕核取方塊下拉式功能表按鈕密碼欄位

5 <FORM>...</FORM> 標籤 ACCEPT-CHARSET="... CHARSET="... ACCEPT="... ACTION="URL URL" ENCTYPE="..." METHOD="{GET,POST}" NAME="..." TARGET="..." onsubmit="..." onreset="..." ="...": 這個標籤亦接受 CLASS ID STYLE TITLE LANG DIR onclick ondblclick onmousedown onmouseup onmouseover onmousemove onmouseout onkeypress onkeydown onkeyup 等屬性

6 <INPUT> 標籤 ALIGN= {LEFT,CENTER,RIGHT} {LEFT,CENTER,RIGHT} ACCEPT="... CHECKED DISABLED MAXLENGTH="n NAME="... NOTAB READONLY SIZE="n SRC="URL URL TABINDEX TYPE="{TEXT,PASSWORD,RADIO,CHECKBOX,SUBMIT,RESET,FILE,IMA GE, HIDDEN,BUTTON} USEMAP VALUE="... onfocus="... ="... onblur="... ="... onchange="... ="... onselect="..." 這個標籤亦接受 CLASS ID STYLE TITLE LANG DIR onclick ondblclick onmousedown onmouseup onmouseover onmousemove onmouseout onkeypress onkeydown onkeyup 等屬性

7 9-1-2 插入表單與按鈕 <HTML> <HEAD> <TITLE> 大哥大使用意見調查表 </TITLE> </HEAD> <BODY BACKGROUND="mobil0.jpg"> <P><IMG SRC="mobil1.jpg"></P> <FORM> <INPUT TYPE="SUBMIT" VALUE=" 提交 "> <INPUT TYPE="RESET" VALUE=" 重新輸入 "> </FORM> </BODY> </HTML>

8 <BUTTON>...</BUTTON> ACCESSKEY="... DISABLED NAME="... TYPE="{SUBMIT, RESET, BUTTON} VALUE="... 這個標籤亦接受 CLASS ID STYLE TITLE LANG DIR onfocus onblur onclick ondblclick onmousedown onmouseup onmouseover onmousemove onmouseout onkeypress onkeydown onkeyup 等屬性

9-1-3 插入單行文字方塊 <FORM> 姓名 :<INPUT: TYPE="TEXT" NAME="UserName UserName" SIZE="40"><BR> E-Mail:<INPUT TYPE="TEXT" NAME="UserMail UserMail" "

9 9-1-3 插入單行文字方塊 <FORM> 姓名 :<INPUT: TYPE="TEXT" NAME="UserName UserName" SIZE="40"><BR> <INPUT TYPE="TEXT" NAME="UserMail UserMail" " SIZE="40" <INPUT TYPE="SUBMIT" VALUE=" 提交 "> <INPUT TYPE="RESET" VALUE=" 重新輸入 "> </FORM>

10 9-1-4 插入選擇鈕 <FORM> 姓名 :<INPUT: TYPE="TEXT" NAME="UserName UserName" SIZE="40"><BR> <INPUT TYPE="TEXT" NAME="UserMail UserMail" " SIZE="40" 年齡 : <INPUT TYPE="RADIO" NAME="UserAge UserAge" " VALUE="Age1"> 未滿 20 歲 <INPUT TYPE="RADIO" NAME="UserAge UserAge" " VALUE="Age2" CHECKED>20~29 預設的選項 <INPUT TYPE="RADIO" NAME="UserAge UserAge" " VALUE="Age3">30~39 <INPUT TYPE="RADIO" NAME="UserAge UserAge" " VALUE="Age4">40~49 <INPUT TYPE="RADIO" NAME="UserAge UserAge" " VALUE="Age5">50 歲以上 <BR> <INPUT TYPE="SUBMIT" VALUE=" 提交 "> <INPUT TYPE="RESET" VALUE=" 重新輸入 "> </FORM>

12 9-1-5 插入核取方塊 <FORM> 姓名 :<INPUT: TYPE="TEXT" NAME="UserName UserName" " SIZE="40"><BR> <INPUT TYPE="TEXT" NAME="UserMail UserMail" " SIZE="40" 您曾經使用過哪些廠牌的手機? <INPUT TYPE="CHECKBOX" NAME="UserPhone UserPhone[]" VALUE=" 諾基亞 " CHECKED> 諾基亞 <INPUT TYPE="CHECKBOX" NAME="UserPhone UserPhone[]" VALUE=" 摩扥羅拉 "> 摩扥羅拉 <INPUT TYPE="CHECKBOX" NAME="UserPhone UserPhone[]" VALUE=" 易利信 "> 易利信 <INPUT TYPE="CHECKBOX" NAME="UserPhone UserPhone[]" VALUE=" 宏碁 "> 宏碁 <BR> <INPUT TYPE="SUBMIT" VALUE=" 提交 "> <INPUT TYPE="RESET" VALUE=" 重新輸入 "> </FORM>

14 9-1-6 插入多行文字方塊 <TEXTAREA>...</TEXTAREA> 標籤 ACCESSKEY = "... COLS = "n " DISABLED NAME = "... READONLY ROWS = "n " TABINDEX onfocus = "... onblur = "... onchange = "... onselect = "... 這個標籤亦接受 CLASS ID STYLE TITLE LANG DIR onclick ondblclick onmousedown onmouseup onmouseover onmousemove onmouseout onkeypress onkeydown onkeyup 等屬性

15 <FORM> 姓名 :<INPUT: TYPE="TEXT" NAME="UserName UserName" " SIZE="40"><BR> <INPUT TYPE="TEXT" NAME="UserMail UserMail" " SIZE="40" 年齡 : <INPUT TYPE="RADIO" NAME="UserAge UserAge" " VALUE="Age1"> 未滿 20 歲 <INPUT TYPE="RADIO" NAME="UserAge UserAge" " VALUE="Age2" CHECKED>20~29 <INPUT TYPE="RADIO" NAME="UserAge UserAge" " VALUE="Age3">30~39 <INPUT TYPE="RADIO" NAME="UserAge UserAge" " VALUE="Age4">40~49 <INPUT TYPE="RADIO" NAME="UserAge UserAge" " VALUE="Age5">50 歲以上 <BR> 您曾經使用過哪些廠牌的手機? <INPUT TYPE="CHECKBOX" NAME="UserPhone UserPhone[]" VALUE=" 諾基亞 " CHECKED> 諾基亞 <INPUT TYPE="CHECKBOX" NAME="UserPhone UserPhone[]" VALUE=" 摩扥羅拉 "> 摩扥羅拉 <INPUT TYPE="CHECKBOX" NAME="UserPhone UserPhone[]" VALUE=" 易利信 "> 易利信 <INPUT TYPE="CHECKBOX" NAME="UserPhone UserPhone[]" VALUE=" 宏碁 "> 宏碁 <BR> 您使用手機時最常碰到哪些問題?<BR>? <TEXTAREA NAME="UserTrouble UserTrouble" " COLS="45" ROWS="4"> 線路太忙 </TEXTAREA><BR> <INPUT TYPE="SUBMIT" VALUE=" 提交 "> <INPUT TYPE="RESET" VALUE=" 重新輸入 "> </FORM>

17 9-1-7 插入下拉式功能表 <SELECT>...</SELECT> 標籤 ACCESSKEY = "... MULTIPLE NAME = "... READONLY SIZE = "n " TABINDEX onfocus = "... onblur = "... onchange = "... onselect = "... 這個標籤亦接受 CLASS ID STYLE TITLE LANG DIR onclick ondblclick onmousedown onmouseup onmouseover onmousemove onmouseout onkeypress onkeydown onkeyup 等屬性

18 <OPTION> 標籤 DISABLED SELECTED VALUE = "... 這個標籤亦接受 CLASS ID STYLE TITLE LANG DIR onfocus onblur onchange onselect onclick ondblclick onmousedown onmouseup onmouseover onmousemove onmouseout onkeypress onkeydown onkeyup 等屬性

19 您使用哪家業者的門號?(? 可複選 ) <SELECT NAME="UserNumber UserNumber[]" SIZE="4" MULTIPLE> <OPTION VALUE=" 中華電信 "> 中華電信 <OPTION VALUE=" 台灣大哥大 " SELECTED> 台灣大哥大 <OPTION VALUE=" 遠傳 "> 遠傳 </OPTION> <OPTION VALUE=" 和信 "> 和信 </OPTION> <OPTION VALUE=" 泛亞 "> 泛亞 </OPTION> <OPTION VALUE=" 其它 "> 其它 </OPTION> </SELECT><BR>

http://localhost/ch09/phone.htm?username UserName=%B3%AF%A4p%ADs& UserMail=jeanchen@mail.ht.net.

20 UserName=%B3%AF%A4p%ADs& =Age3&UserPhone=% BF%D5%B0%F2%A8%C8&UserPhone UserPhone=%A9%F6%A7Q%ABH& =%A9%F6%A7Q%ABH&Us ertrouble=%b9q%a6%c0%ab%dd%be%f7%ae%c9%b6%a1% A4%A3%B0%F7%A4%5B&UserNumber UserNumber=%A5x%C6W%A4j%AD %F4%A4j&UserNumber UserNumber=%BB%B7%B6%C7

9-1-8 表單的後端處理一將表單資訊以 E-mail 形式傳送給指定的收件人 FORM METHOD="POST"

21 9-1-8 表單的後端處理一將表單資訊以形式傳送給指定的收件人 FORM METHOD="POST"

24 二讀取表單資訊並製作成確認網頁 <FORM METHOD="POST" ACTION="confirm.php confirm.php">

25 \ch07\confirm.php confirm.php ( 下頁續 ) 01:<HTML> 02: <HEAD> 03: <TITLE> 大哥大使用意見調查表確認網頁 </TITLE> 04: </HEAD> 05: <BODY BACKGROUND="free0.gif"> 06: <P><IMG SRC="free1.jpg"></P> 07: <?php 08: $Name = $_POST["UserName POST["UserName"] "]; 09: $Mail = $_POST["UserMail POST["UserMail"] "]; 10: switch($_post["userage $_POST["UserAge"] "]) 11: { 12: case "Age1": 13: $Age = " 未滿 20 歲 "; 14: break; 15: case "Age2": 16: $Age = "20~29"; 17: break; 18: case "Age3": 19: $Age = "30~39";

26 \ch07\confirm.php confirm.php ( 接上頁 ) 20: break; 21: case "Age4": 22: $Age = "40~49"; 23: break; 24: case "Age5": 25: $Age = "50 歲以上 "; 26: } 27: $Phone = $_POST["UserPhone POST["UserPhone"] "]; 28: $Trouble = $_POST["UserTrouble POST["UserTrouble"] "]; 29: $Number = $_POST["UserNumber POST["UserNumber"] "]; 30:?> 31: <P><I><? <?php echo $Name;?></I> </I>,, 您好! 您輸入的資訊如下 :</P>: 32: 電子郵件地址 :<?: <?php echo $Mail;?><BR> 33: 年齡 :<?: <?php echo $Age;?><BR> 34: 曾經使用過的手機廠牌 :<?: <?php foreach($phone as $Value) echo $Value.' ';?><BR> 35: 使用手機時最常碰到的問題 :<?: <?php echo $Trouble;?><BR> 36: 使用哪家業者的門號 :<?: <?php foreach($number as $Value) echo $Value.' ';?> 37: </BODY> 38:</HTML>

$9-1-9 插入密碼欄位 \ch07\pwd.$

27 9-1-9 插入密碼欄位 \ch07\pwd.htm <HTML> <BODY> <FORM> 請輸入密碼 :<INPUT: TYPE="PASSWORD" NAME="UserPWD UserPWD" " SIZE="10"> <INPUT TYPE="SUBMIT" VALUE=" 提交 "> <INPUT TYPE="RESET" VALUE=" 重新輸入 "> </FORM> </BODY> </HTML>

28 插入隱藏欄位 <INPUT TYPE="HIDDEN" NAME="Author" VALUE="JeanChen JeanChen">

Microsoft PowerPoint - ch07_1.ppt

Microsoft PowerPoint - ch07_1.ppt 表單 7-1 認識表單表單的建立可以分成三個階段 : 一決定要蒐集的資料二建立表單三設計表單處理程式單行文字方塊多行文字方塊核取方塊選擇鈕下拉式功能表按鈕密碼欄位 7-2 將電腦架設為 Web 伺服器 1. 2. 3. 7-3 建立表單的輸入介面 ... 標籤屬性解說 : ACCEPT-CHARSET="..." ACCEPT="... ACTION="URL