0、概述
本demo實現以下功能:
①在html頁面輸入姓名和郵箱,點擊提交(這里為get)
②服務器通過解析表單內容,返回對“姓名”和“郵箱”的一個歡迎頁面
1、軟件準備
①xampp
作用:提供apache服務
②webStorm
作用:編輯html、php代碼
2、服務器準備
進入xampp的hotdocs目錄,如圖:
<!DOCTYPE html><html lang='en'><head> <meta charset='UTF-8'> <title></title></head><body>Welcome <?php echo $_GET['name']; ?><br>Your email address is: <?php echo $_GET['email']; ?></body></html>
3、web前端準備
1 <!DOCTYPE html> 2 <html lang='en'> 3 <head> 4 <meta charset='UTF-8'> 5 <link rel='stylesheet' href='jqm/jquery.mobile-1.4.5.min.css'> 6 <script type='text/javascript' src='js/jquery-2.2.2.min.js'></script> 7 <script type='text/javascript' src='jqm/jquery.mobile-1.4.5.min.js'></script> 8 <script type='text/javascript' src='js/app.js'></script> 9 </head>10 11 <body>12 <div data-role='page'>13 <div data-role='header'>14 <h3>header in page</h3>15 </div>16 <div class='ui-content'>17 <form action='http://172.163.0.195:8888/index.php' method='get'>18 Name: <input type='text' name='name'><br>19 E-mail: <input type='text' name='email'><br>20 <input type='submit' value='提交'>21 </form>22 </div>23 24 <div data-role='footer' data-position='fixed'>25 <h3>footer</h3>26 </div>27 </div>28 29 </body>
注意上述代碼的17行中的'http://172.163.0.195:8888'要替換成你自身的ip地址和端口號(端口號是在xampp中設置的)
4、運行
①運行xampp的apache服務,這里注意端口號要和代碼中的保持一致
②運行webstorm代碼
③在瀏覽器中填寫name和email,提交,然后看php返回結果是否一致,(demo完畢)
PHP編程鄭重聲明:本文版權歸原作者所有,轉載文章僅為傳播更多信息之目的,如作者信息標記有誤,請第一時間聯系我們修改或刪除,多謝。
新聞熱點
疑難解答