網頁標題： 第一張表單

Warning: fopen(/home/crazy/www/learner/cpuroom/programmer/has_read.php): failed to open stream: Permission denied in /home/crazy/www/compose/reading.php on line 2077

Warning: fputs() expects parameter 1 to be resource, bool given in /home/crazy/www/compose/reading.php on line 2079

Warning: fclose() expects parameter 1 to be resource, bool given in /home/crazy/www/compose/reading.php on line 2080
　
﹗﹗﹗觀看留言：此文章已經有5則留言 ﹗﹗﹗


我也覺得在 linux 作業系統上架設網頁比較安全， 也許只要安裝伺服器相關的軟體在自己的微軟 windows 主機也能架設網頁，
然而 linux 的穩定與開放還是比較讓我放心，
學習的故鄉這個小小的網站，
它也是架在一台名為小地鼠的 linux 主機上的喔。
所以我們在此學習 php，
希望各位能夠學會如何使用 telnet 登入 linux，
然後也能學會使用有支援 linux 的編輯器來編輯 .php 或者其他所有網頁上的文字檔。
如果說你實在不知該怎樣透過 telnet 的方式登入某台 linux 伺服器主機的話，
你還是可以在自己的電腦用任何一種 windows 純文字編輯器，
把 .php 檔案編輯好後再上傳到你所屬的網頁伺服器主機，
例如小地鼠或者淡大 mail3，
或者你自己在網路上找到的任何一台有支援 linux 的網頁伺服器，
只要能透過 ftp 傳輸協定把你已經編輯好的檔案上傳到該主機，
並且還可以透過瀏覽器以 http 的通訊協定瀏覽這個檔案那都沒關係。
至於檔案權限設定與管理及其他 linux 網頁相關的指令，
當我們日後用到時會一一的來與各位分享，
此刻就先讓我們來學習怎樣製作表單，
然後我們也會在下一篇文章學會如何使用 php 來處理表單資料。

凡是要輸入資料的頁面都需使用表單， 簡單的說，
所謂的表單，
就是可以讓使用者輸入資料的網頁。
例如在某個網站註冊成為會員要輸入的基本資料，
或者能讓你在某個可編輯的文字輸入關鍵詞的搜尋引擎，
還有發表留言、檔案上傳等等，
也包括網路銀行、購物網站，
這些通通都要用到表單。
我們先來學習製作一個極為簡單的文字輸入欄位表單頁面，
該表單只有一個可編輯的文字，
就連送出表單的按鈕也沒有，
因此只能讓網頁使用者輸入一行資料，
然後直接按迴車鍵把表單送出去，
至於還有其他哪些跟表單有關係的標籤我們可以拿來應用的呢？
套用那句老話：
「當我們用到的時候再學！」
隨時隨地保持一顆愛學習的心就對了。

請仔細閱讀下面代碼內容， 表單的起始與結尾標籤是：
<form> </form>
各位不知是否已經知道？
有很多網頁標籤都是以成雙成對的方式出現的，
有開始就會有結束，
許多許多的精采跟奇蹟都是在開始與結束之間發生的。
凡是代表結束的標籤，
在小於跟大於之間的標籤名稱前面都會加入斜線(/)，
用以代表某個事件的結束，
這是學習撰寫網頁的基本概念喔！
除了要先把表單的開頭與結尾寫好之外，
在表單之中你希望呈現哪些表單功能，
就要把那些功能的標籤寫在表單標籤內。
例如在本篇文章我們只呈現一個可編輯的文字框，
讓網頁用戶可以在該可編輯的文字輸入一行內容，
因此我們就要知道「文字輸入框」這個標籤怎樣寫？
還有，
當網頁用戶在可編輯的文字裡把文字輸入完畢後，
這個文字內容該以什麼樣的方式傳送、
以及要被送往哪個地方去處理？
這些都要在表單的開始標籤裡頭清清楚楚地告訴電腦。

由於下面這個代碼只是個很單純的表單結構， 裡面只有一個文字輸入框，
因此除了開頭與結束標籤，
實際上的表單內容只有一行。
如果你想在故鄉部落格寫文章，
把這個表單也寫到文章裡頭的話，
那麼只要把下面代碼第七八九這三行內容複製下來便可以了。

請仔細閱讀第七行代碼， 該行內容用小於跟大於符號包住，
除了 form 代表這是一個表單的起始標籤之外，
另外還有 method 和 action 兩個屬性。
這兩個屬性
method 是表單資料傳送的方式，
我目前只知有 post 及 get 這兩種表單資料傳遞方式，
且我也不曾用過 get 來傳送表單，
所以在寫表單傳送方式的時候我只會寫：
method=post，
表示這個表單要用 post 來傳送資料。
action 則在指明表單資料該送達哪個檔案去處理，
如果所要送達的檔案正好也在同一個網頁伺服器上，
通常就只會寫檔案名稱，
檔案的網路位置可以不用寫；
但如果資料是被送到其他伺服器的某個檔案去處理，
那麼就該把這個檔案所在的完整網路位置寫清楚。
因此第七行的代碼主要就是在告訴電腦：
「當使用者把表單填寫完畢之後，
請把這些資料以什麼樣的方式送到哪個伺服器的哪個檔案去處理。」

再請注意第八行內容， 它也用小於和大於符包著，
input 代表這是一個可以輸入資料的標籤，
裡面有幾個屬性要特別告訴大家的：
「type="text"」，
代表這個輸入標籤是一個文字輸入框。
「name="friend"」，
表示當填寫在該框框內的資料被送到指定的位置時，
會被放在一個叫做 friend 的變數裡，
只要知道這點，
我們就可以寫個程式來處理該欄位的這個資料了。
「value=""」，
這裡並沒有預設任何資料給它，
只使用一對雙引號來呈現，
其實既然不給它任何預設值的話，
這個屬性省略不寫也沒關係的。
「size="20"」，
表示所設定的文字輸入框的寬度。

<input> 標籤除了 "text" 這個 type 之外， 還有其他好用的資料輸入類型，
例如選項按鈕、
核取方塊、
密碼欄位輸入、
要傳送的隱藏資料、
送出表單的按鈕等等，
這些日後我們都會用到，
在此先不講。
此外，
屬性名稱的等於號是「設定」的意思，
設定值可以用雙引號或者單引號包住，
也有人懶惰不寫，
這可能會發生一些意想不到的後果，
我們將來遇到時再說！

至於第九行就不必多說了， 那只是表單的結束標籤，
請各位只需知道凡是代表結束的標籤，
(/) 斜線要寫在小於符號之後，
然後再寫標籤的名稱，
最後還要再寫大於符才行。
這篇文章的代碼真正的表單是從第七行那個標籤開始，
一直到第九行結束，
其餘的都是 html 基本架構標籤，
因此我們僅先從第七行開始說起，
說到第九行為止，
別忘了，
把題號刪除才可以看到執行的效果喔！

我在寫這篇文章的同時， 正和笑笑鴿討論故鄉的一些程序問題，
鴿子說他也剛好在線上教同學寫表單，
真是太巧合了呢！
於是他建議我把 action 的位置設定在學生寫好的 php 程序？
如果你沒改寫此篇文章代碼內容，
不妨瀏覽看看文字框裡的輸入資料被送出去以後會怎樣呈現在電腦螢幕上？
希望這也可以算是鼓勵同學們願意繼續好好學習寫程式。

為了日後教學文件方便表達， 我把這篇文章的表單取個名字，
叫做「幻境入門」，
因為這張表單的資料將會被傳送到「幻境之家」這個網頁去處理，
當你在幻境入門這張表單，
把資料輸入到唯一的可編輯的文字框，
然後按下回車鍵，
幻境之家將會如何處理你所輸入的資料呢？
請見下文分解！




[/code]

執行

回 · 大家來學php 這一篇文章封面
本文張貼者：程咬金〔張貼時間：民國101年2月5日（星期天）15點41分 | 更新次數 #3 | 最後更新：民國101年4月4日（星期三）10點31分〕 | 寫信給程咬金

部落格首頁

學習的故鄉首頁
本站公告：〔您越需要我們，我們就越有創意〕 本站說明書：〔發現故鄉還有改進的地方，請來信告訴原丁們〕
觀察應用學習點數 ：〔咱的故鄉有您的參與，會使我們有更大的發揮空間，展現更豐富精彩的學習畫面〕 〔期待藉由無障礙網頁設計，能讓視障小朋友更愛看書、更愛寫作且更愛學習〕：盲用電腦「心得分享」
〔為了讓我們有乾淨的學習環境，請勿任意在本站散播商業廣告與不合法文件或聯結〕：本站宣示