HTML表單
表單用于搜集不同類型的用戶輸入,表單由不同類型的標簽組成,實現一個特定功能的表單區域(比如:注冊),
首先應該用標簽來定義表單區域整體,在此標簽中再使用不同的表單控件來實現不同類型的信息輸入,
具體實現及注釋可參照以下偽代碼:
<!-- label標簽定義表單控件的文字標注,input類型為text定義了一個單行文本輸入框 -->
<p><label>姓名:</label><input type="text" name="username" />
</p><!-- input類型為password定義了一個密碼輸入框 -->
<p><label>密碼:</label><input type="password" name="password" />
</p><!-- input類型為radio定義了單選框 -->
<p><label>性別:</label><label><input type="radio" name="gender" value="0" /> 男</label><label><input type="radio" name="gender" value="1" /> 女</label>
</p><!-- input類型為checkbox定義了單選框 -->
<p><label>愛好:</label><label><input type="checkbox" name="like" value="sing" /> 唱歌</label><label><input type="checkbox" name="like" value="run" /> 跑步</label><label><input type="checkbox" name="like" value="swiming" /> 游泳</label>
</p><!-- input類型為file定義上傳照片或文件等資源 -->
<p><label>照片:</label><input type="file" name="person_pic">
</p><!-- textarea定義多行文本輸入 -->
<p><label>個人描述:</label><textarea name="about"></textarea>
</p><!-- select定義下拉列表選擇 -->
<p>
<label>籍貫:</label><select name="site"><option value="0">北京</option><option value="1">上海</option><option value="2">廣州</option><option value="3">深圳</option></select>
</p><!-- input類型為submit定義提交按鈕還可以用圖片控件代替submit按鈕提交,一般會導致提交兩次,不建議使用。如:<input type="image" src="xxx.gif">
-->
<p><input type="submit" name="" value="提交"><!-- input類型為reset定義重置按鈕 --><input type="reset" name="" value="重置">
</p>
input表單項中的屬性,可以提供
*type屬性:表示表單項的類型:值如下:text:單行文本框password:密碼輸入框checkbox:多選框 注意要提供value值radio:單選框 注意要提供value值file:文件上傳選擇框button:普通按鈕submit:提交按鈕image:圖片提交按鈕reset:重置按鈕, 還原到開始\(第一次打開時\)的效果hidden:主表單隱藏域,要是和表單一塊提交的信息,但是不需要用戶修改*name屬性:表單項名,用于存儲內容值的*value屬性:輸入的值\(默認指定值\)size屬性:輸入框的寬度值maxlength屬性:輸入框的輸入內容的最大長度readonly屬性:對輸入框只讀屬性*disabled屬性:禁用屬性*checked屬性:對選擇框指定默認選項src和alt是為圖片按鈕設置的注意:reset重置按鈕是將表單數據恢復到第一次打開時的狀態,并不是清空image圖片按鈕,默認具有提交表單功能。placeholder 屬性規定可描述輸入字段預期值的簡短的提示信息(比如:一個樣本值或者預期格式的短描述)。該提示會在用戶輸入值之前顯示在輸入字段中。注意:placeholder 屬性適用于下面的 input 類型:text、search、url、tel、email 和 password。