實(shí)驗(yàn)十二 PHP表單處理

1、實(shí)驗(yàn)十二 PHP表單處理 一、實(shí)驗(yàn)?zāi)康呐c要求1.復(fù)習(xí)編寫(xiě)和測(cè)試PHP程序的方法。2.掌握創(chuàng)建表單的方法。3.掌握添加和設(shè)置表單元素的方法。4.掌握獲取表單參數(shù)的方法。5.掌握驗(yàn)證表單數(shù)據(jù)正確性的方法二、實(shí)驗(yàn)內(nèi)容1. GET和POST方法表單屬性中的“方法method”：用于設(shè)置將表單數(shù)據(jù)發(fā)送到服務(wù)器的方法。l POST：用標(biāo)準(zhǔn)輸入方式將表單中的數(shù)據(jù)傳送給服務(wù)器，服務(wù)器用讀取標(biāo)準(zhǔn)輸入的方式讀取表單內(nèi)的數(shù)據(jù)。l GET（默認(rèn)）：將表單內(nèi)的數(shù)據(jù)附加到URL后傳送給服務(wù)器，服務(wù)器用讀取環(huán)境變量的方式讀取表單內(nèi)的數(shù)據(jù)。注意：發(fā)送用戶名和密碼等機(jī)密信息時(shí)，應(yīng)使用POST方法?！救蝿?wù)1】在網(wǎng)頁(yè)中創(chuàng)建2個(gè)表單

2、，分別使用POST和GET方法傳遞數(shù)據(jù)，比較二者區(qū)別。要求：（1）新建index1.php網(wǎng)頁(yè)，存放在“task1”文件夾中，在該網(wǎng)頁(yè)中創(chuàng)建2個(gè)表單form1和form2，分別設(shè)置用POST和GET方法來(lái)提交表單數(shù)據(jù)，并在表單中添加并設(shè)置表單控件，效果如下圖所示：（2）新建post.php頁(yè)面，存放在“task1”文件夾中，在該網(wǎng)頁(yè)中輸入PHP代碼，采用POST方法獲取表單form1的數(shù)據(jù)。（3）新建get.php頁(yè)面，存放在“task1”文件夾中，在該網(wǎng)頁(yè)中輸入PHP代碼，采用GET方法獲取表單form2的數(shù)據(jù)。步驟：（1）將教師機(jī)共享的“實(shí)驗(yàn)12”文件夾中的“task1”“task3”文件

3、夾復(fù)制到文件夾“C:phpstudyWWW”中。打開(kāi)Dreamweaver CS5軟件，把軟件右上角的“設(shè)計(jì)器”模式換成“經(jīng)典”。如下圖所示：（2）新建一個(gè)PHP頁(yè)面，并保存在文件夾“C:phpstudyWWWtask1”中，命名為index1.php。將網(wǎng)頁(yè)文檔的標(biāo)題改成“POST和GET方法比較”。 （3）在index1.php網(wǎng)頁(yè)中創(chuàng)建一個(gè)表單form1，在“屬性”面板中，修改它的屬性，如下圖所示：在該表單form1中添加表單元素，如下圖所示（其中藍(lán)色文字是說(shuō)明）：設(shè)置“用戶名”之后文本字段的屬性，如下圖所示:設(shè)置“密碼”之后文本字段的屬性，如下圖所示:設(shè)置“提交”按鈕的屬性，如下圖所示

4、:（4）在index1.php網(wǎng)頁(yè)中再創(chuàng)建一個(gè)表單form2，在“屬性”面板中，修改它的屬性，如下圖所示：（5）在該表單form2中添加表單元素，如下圖所示（其中藍(lán)色文字是說(shuō)明）：設(shè)置“用戶名”之后文本字段的屬性，如下圖所示:設(shè)置“密碼”之后文本字段的屬性，如下圖所示:設(shè)置“提交”按鈕的屬性，如下圖所示:（6）新建一個(gè)PHP頁(yè)面，并保存在文件夾“C:phpstudyWWWtask1”中，命名為post.php。將網(wǎng)頁(yè)文檔的標(biāo)題改成“POST”，然后切換到“代碼”視圖，在和之間添加代碼，如下圖所示：（7）新建一個(gè)PHP頁(yè)面，并保存在文件夾“C:phpstudyWWWtask1”中，命名為get.

5、php。將網(wǎng)頁(yè)文檔的標(biāo)題改成“GET”，然后切換到“代碼”視圖，在和之間添加代碼，如下圖所示：（8）完成后，保存這3個(gè)網(wǎng)頁(yè)文檔，按下F12鍵在瀏覽器中預(yù)覽index1.php的效果。此時(shí)，會(huì)彈出設(shè)置服務(wù)器的提示，單擊“是”，就可以在站點(diǎn)設(shè)置中建立一個(gè)新站點(diǎn)，如下圖所示：輸入站點(diǎn)名稱：PHP實(shí)驗(yàn)，本地站點(diǎn)文件夾：C:phpstudyWWW。單擊左側(cè)的“服務(wù)器”，會(huì)出現(xiàn)一個(gè)設(shè)置服務(wù)器的窗口，點(diǎn)擊“+”按鈕，添加一個(gè)遠(yuǎn)程服務(wù)器。在彈出的窗口中設(shè)置服務(wù)器的基本和高級(jí)選項(xiàng)（如下圖所示），完成后，單擊“保存”按鈕。服務(wù)器設(shè)置完成后，預(yù)覽網(wǎng)頁(yè)index1.php，如下圖所示：在“使用POST提交數(shù)據(jù)”中輸入

6、用戶名、密碼，然后點(diǎn)擊“提交”按鈕，將打開(kāi)post.php網(wǎng)頁(yè)，如下圖所示：請(qǐng)注意觀察地址欄的內(nèi)容中不包含用戶名和密碼的值。在“使用GET提交數(shù)據(jù)”中輸入用戶名、密碼，然后點(diǎn)擊“提交”按鈕，將打開(kāi)get.php網(wǎng)頁(yè)，如下圖所示：請(qǐng)注意觀察地址欄的內(nèi)容中包含了用戶名username2和密碼password2的值。2. 驗(yàn)證表單數(shù)據(jù)的正確性驗(yàn)證表單數(shù)據(jù)的正確性是指檢查訪問(wèn)者在表單中輸入的數(shù)據(jù)類(lèi)型是否正確，以防表單提交到服務(wù)器后指定的文本域或所有文本域中包含無(wú)效的數(shù)據(jù)?！救蝿?wù)2】制作一個(gè)“用戶注冊(cè)”頁(yè)面，并使用PHP代碼驗(yàn)證表單數(shù)據(jù)的正確性。步驟：（1）打開(kāi)Dreamweaver CS5軟件，新建一

7、個(gè)PHP頁(yè)面，并保存在文件夾“C:phpstudy WWWtask2”中，命名為index2.php。將網(wǎng)頁(yè)文檔的標(biāo)題改成“用戶注冊(cè)”。 （2）在index2.php網(wǎng)頁(yè)中創(chuàng)建一個(gè)表單form1，在“屬性”面板中，修改它的屬性，如下圖所示：（3）在該表單form1中添加文字“請(qǐng)?zhí)顚?xiě)以下注冊(cè)信息：”，然后插入一個(gè)8行2列的表格，表格的屬性如下圖所示：合并表格最后一行的2個(gè)單元格，將表格的背景顏色修改成淺藍(lán)色（可以根據(jù)你自己喜好來(lái)修改顏色）。然后在該表單form1中添加表單元素，如下圖所示（其中藍(lán)色文字是說(shuō)明，*代表必填信息）：設(shè)置“用戶名”之后文本字段的屬性，如下圖所示:設(shè)置“密碼”之后文本字段

8、的屬性，如下圖所示:設(shè)置“重復(fù)密碼”之后文本字段的屬性，如下圖所示:設(shè)置“性別”單選按鈕“男”和“女”的屬性，如下圖所示:設(shè)置“E-mail電子郵箱”之后文本字段的屬性，如下圖所示:設(shè)置“手機(jī)號(hào)碼”之后文本字段的屬性，如下圖所示:設(shè)置“興趣愛(ài)好”之后的各個(gè)復(fù)選框?qū)傩?，如下圖所示:其他復(fù)選框的設(shè)置屬性的方法類(lèi)似，只需設(shè)置“選定值”為各個(gè)名稱，然后初始狀態(tài)都是“未選中”初態(tài)。設(shè)置“提交數(shù)據(jù)”按鈕的屬性，如下圖所示:（4）新建一個(gè)PHP頁(yè)面，并保存在文件夾“C:phpstudyWWWtask2”中，命名為getuser.php。將網(wǎng)頁(yè)文檔的標(biāo)題改成“用戶注冊(cè)”，然后切換到“代碼”視圖，在和之間添加代

9、碼，如下圖所示：（5）完成后，保存這2個(gè)網(wǎng)頁(yè)文檔，按下F12鍵在瀏覽器中預(yù)覽index2.html的效果。如下圖所示：在頁(yè)面中輸入“注冊(cè)信息”，然后點(diǎn)擊“提交數(shù)據(jù)”按鈕，將打開(kāi)getuser.php網(wǎng)頁(yè)，顯示出提示信息及注冊(cè)成功的用戶名，如下圖所示：如果沒(méi)有輸入用戶名、密碼或手機(jī)號(hào)碼，或者兩次輸入的密碼不一致，將會(huì)彈出對(duì)應(yīng)的提示錯(cuò)誤對(duì)話框。如下圖所示： 【任務(wù)3】制作一個(gè)PHP頁(yè)面，用于計(jì)算2個(gè)數(shù)的加減乘除，并將結(jié)果輸出顯示。(作業(yè))將該P(yáng)HP頁(yè)面保存在文件夾“C:phpstudyWWWtask3”中，命名為index3.php。步驟：（1）打開(kāi)Dreamweaver CS5軟件，新建一個(gè)PH

10、P頁(yè)面，并保存在文件夾“C:phpstudy WWWtask3”中，命名為index3.php。將網(wǎng)頁(yè)文檔的標(biāo)題改成“計(jì)算”。 （2）在index3.php網(wǎng)頁(yè)中創(chuàng)建一個(gè)表單form1，在“屬性”面板中，修改它的屬性，如下圖所示：（3）在該表單form1添加表單元素，完成加法計(jì)算，如下圖所示（其中藍(lán)色文字是說(shuō)明）：設(shè)置第一個(gè)文本字段的屬性，如下圖所示:設(shè)置第二個(gè)文本字段的屬性，如下圖所示:設(shè)置第三個(gè)文本字段的屬性，如下圖所示:設(shè)置“等于”按鈕的屬性，如下圖所示:（4）切換到“代碼”視圖，在和之間添加代碼，如下圖所示：（5）完成后，保存index3.php網(wǎng)頁(yè)文檔，按下F12鍵在瀏覽器中預(yù)覽效果。在表單中輸入2個(gè)數(shù)字，然后點(diǎn)擊“等于”按鈕，看看右側(cè)的文本框中是否能顯示出正確的結(jié)果。如下圖所示：（6）用類(lèi)似的方法，在表單中繼續(xù)添加表單元素，完成減法、乘法和除法運(yùn)算，并將結(jié)果輸出顯示。表單如下圖所示，請(qǐng)同學(xué)們分析題意，自己修改相應(yīng)代碼。編程提示：可以使用ifelse if分支結(jié)構(gòu)來(lái)編程。注意除法的除數(shù)不能為0，如果用戶輸入0，需彈出對(duì)應(yīng)的提示錯(cuò)誤對(duì)話框。如下圖所示：乘法計(jì)算的結(jié)果文本框的字符寬度和最多字符數(shù)應(yīng)設(shè)置為30，其他計(jì)算結(jié)果的文本框?qū)挾瓤梢允?0。在顯示某一個(gè)計(jì)算結(jié)果時(shí)，除了當(dāng)前輸入的2個(gè)