首頁 > web前端 > html教學 > HTML中表單的相關知識摘要(程式碼實例)

HTML中表單的相關知識摘要(程式碼實例)

不言
發布: 2018-10-12 17:32:16
轉載
2555 人瀏覽過

這篇文章帶給大家的內容是關於HTML中表單的相關知識總結(程式碼實例),有一定的參考價值,有需要的朋友可以參考一下,希望對你有幫助。

當使用者熟悉了靜態網頁製作後就能感受到它的功能單一,會想建立具有互動性的動態網站。動態網站常用到的一個元素就是表單。表單是HTML的一個重要組成部分,是網站管理員與使用者之間溝通的橋樑。

表單標籤--from

是一個雙標籤。標籤所包含的資料有表單控制項及必須的伴隨數據,如控制項標籤、處理資料的腳本等。主要有表單名稱、資料處理、資料傳輸方式等5個基本屬性,其中表單的程式處理和資料傳輸方式是不可或缺的。

程式處理屬性--action

表單本身是沒有用途的,使用者填入表單的資訊需要程式來處理,表單裡的'action'就定義了表單所要提交到的目的文件,該目的文件收到資訊後,通常和一個程式連接實現資料的處理。
屬性值可以是一個程序,也可以是一個腳本的URL位址

登入後複製
登入後複製
登入後複製
登入後複製

##表單名稱屬性--name
用來為表單命名。建議每一表單設定一個功能相符的名稱,防止資訊提交到後台程式處理時出亂。

登入後複製
登入後複製
登入後複製
登入後複製

##資料傳輸方式--method
定義了表單資料傳送的方式,資料傳送到'action'屬性所規定的頁面,主要針對服務端進行處理。可作為URL變數(method='get')或HTTP post(method='post')的方式來傳送。

登入後複製
登入後複製
登入後複製
登入後複製

#輸入類別控件
表單元素也稱為表單控件,依照填寫方式分為輸入類別和下拉式選單類別。用<input>標籤定義。

登入後複製
登入後複製
登入後複製
登入後複製
<input>

文字方塊--text

最常見的文字輸入區域,在登陸區,討論區等。在頁面中以單行文字方塊顯示

<input>
登入後複製
登入後複製
登入後複製
登入後複製
登入後複製
登入後複製

如果希望文字方塊只讀,可以使用'readonly'設定

<input>
登入後複製
登入後複製
登入後複製
登入後複製
登入後複製
登入後複製

密碼框--password

隱藏輸入框內容,輸入的字元會用'*'代替

<input>
登入後複製
登入後複製
登入後複製
登入後複製
登入後複製
登入後複製

單選框--radioHTML中表單的相關知識摘要(程式碼實例)

當出現多個選項而且只能選擇一個時,會用到單選框。向指定某個選項預設狀態下為選取狀態時,用'checked'屬性定義。只能有一個單選框設定。要傳送到處理程序中,需要設定value屬性。

<input>
登入後複製
登入後複製
登入後複製
登入後複製
登入後複製
登入後複製
複選框--checkbox

是可以選多個選項的選項框,也可預設多個選項都處於選取狀態。

<input>
登入後複製
登入後複製
登入後複製
登入後複製
登入後複製
登入後複製

文本域--textarea

主要用於輸入多行文本,常見於留言、評論區。 'rows'文字域行數,'cols'文字域列數.

<textarea>
</textarea>
登入後複製
nbsp;html>


    <meta>
    <title>表单标签</title>


登入後複製
    

用户注册页面

    用户名:<input>
    密    码:<input>
    确认密码:<input>
    
    你的年龄是:     <input>18岁以下     <input>19-35岁     <input>35岁以上     
    你的个人爱好:     <input>阅读     <input>写作     <input>运动     <input>游戏     <input>其他     
    自我介绍     
    

#按鈕

標準按鈕--button


常見的灰色小來塊,需要關聯相應的腳本程式來處理表單,'value'可以設定按鈕上要顯示的文本,'onclick'可以實現滑鼠處理的一些功能。

<input>
登入後複製
登入後複製
登入後複製
登入後複製
登入後複製
登入後複製
HTML中表單的相關知識摘要(程式碼實例)提交按鈕和重置按鈕--

是一類特殊的按鈕,不需要設定參數,也可以實現,表單資料處理。一般來說,提交按鈕和重置按鈕同時出現。

<input>
<input>
登入後複製

選單清單控制項

#########下拉式選單#########可以節省頁面空間。 標籤裡面。 'selected'表示初始被選取的選項。 ###
<select>
    <option>选项一</option>
    <option>选项二</option>
    <option>选项三</option>
</select>
登入後複製
nbsp;html>


    <meta>
    <title>按钮</title>


登入後複製
    用户名:<input>
    密    码:<input>
    
    生日          
############以上就是本篇文章的全部內容,關於HTML的相關知識大家可以參考PHP中文網的###HTML開發手冊###進行學習。 ############

以上是HTML中表單的相關知識摘要(程式碼實例)的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:segmentfault.com
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
作者最新文章
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板