1. 程式人生 > 實用技巧 >HTML語言表單使用

HTML語言表單使用

name:表單的名字,用於後續方便引用
action:表單提交的伺服器地址
method:表單提交的方式,一般為get和post兩種方式
get:會把請求引數名和值轉成字串,並會拼接在請求地址後面,可以在位址列中看到請求的引數名和值,一般不能大於2kb
post:請求引數名和值放到html的header中傳輸,位址列中看不到,傳輸大小可以不受限制(取決於伺服器的限制,例如上傳檔案大於200GB就不讓上傳了)

表單控制元件1:

input:

屬性:
type:指定當前控制元件的型別
value : 存放傳遞的資料(預設值)
placeholder :提示預設文字,文字框沒有內容的時候顯示的提示,當獲取焦點時會提示會消失
name:控制元件名稱
disabled: 禁用此元素
maxlength: 允許輸入的最大字元數 maxlength="10"代表對多輸入10個字元
size: 指定改元素的長度(寬度)
readonly :元素內容不可修改,直供讀取使用

type屬性值:

1,text:單行文字框

2, password:密碼框

3, radio:單選框 備註:多個單選按鈕需要name值一致才能成為一組
屬性:
checked="checked" 選中狀態

4, checkbox:複選框
屬性:
checked="checked" 選中狀態

5, file:檔案上傳域

6, hiddle:隱藏域
使用場景:頁面中有些要傳輸的資料不展示給使用者,就可以使用隱藏域實現,
但是原始碼中一樣可以看到,所以這裡避免敏感資料

7, (1)input按鈕:
屬性:
type:submit 提交按鈕,rest 重置按鈕,button 普通按鈕
value 按鈕的名稱
name:按鈕名稱
disabled 禁用此元素
(2)button按鈕,比input更加語義化,更靈活
屬性:
type:submit 提交按鈕,rest 重置按鈕,button 普通按鈕
name:按鈕名稱
disabled 禁用此元素

label標籤:配合input控制元件使用,可以關聯控制元件

當點選label中的內容時,對應的input框就可以自動獲取焦點

<label for="pass">密碼:</label>
<input type="password" name="password" id="pass"/>