第九課 表單及表單控制元件 html5學習4
表單有由表單域、提示文字、表單3部分構成
一、表單控制元件
input 控制元件
1、<input />單標籤
2、input屬性:
可以透過type屬性變換形狀
value預設值
name名稱
checked=checked預設選中
maxlength 最多輸入 正整數
3、<input /> type屬性值:text文字框、
password密碼框、
radio單選框 如果是一組,透過相同的name實現、
checkbox核取方塊、
button普通按鈕、
submit 提交按鈕、
reset 重置按鈕、
image 圖片按鈕、
file 檔案域 檔案按鈕
label標籤
1、label直接進行包裹 : <label>輸入賬號:<input type="text"/></label>
2、如果label裡面有多個表單,想定位到某個 可以透過for id的格式進行
textarea 文字域
多用於評論框,留言框
1、<textarea>請輸入留言</textarea>
select 下拉選單標籤
1、語法結構
<select>
<option>選項1</option>
<option>選項2</option>
<option>選項3</option>
</select>
2、注意:
<select></select>中應至少包含一對<option></option>
在option中定義selected="selected"時、當前選項即為預設選項
二、表單域
表單域 form 收集表單控制元件資訊,並且提交的。
1、語法結構
<form>
<p>使用者名稱:<input type="text" name="username"/></p>
<p>密 碼:<input type="password" name="pwd"/></p>
<input type="submit" value="提交"/>
<input type="reset" value="重置"/>
</form>
2、常用屬性
action="地址"
method 用於設定表單資料提交方式,取值為get或post
get速度塊但是會顯示錶單裡面的內容,不安全,不能做密碼的提交
post速度慢一些 但是 不會顯示錶單內容 安全一些
name 屬性
作者:
原文連結:https://www.cnblogs.com/Liuxingtao/p/10405037.html
來自 “ ITPUB部落格 ” ,連結:http://blog.itpub.net/2558/viewspace-2821890/,如需轉載,請註明出處,否則將追究法律責任。
相關文章
- HTML5 學習筆記 表單屬性HTML筆記
- <react學習筆記(9)>表單控制元件React筆記控制元件
- JavaScript 表單及表單驗證JavaScript
- React學習(九):表單React
- react學習(四)- 表單React
- Angular 4.x 自定義表單控制元件Angular控制元件
- HTML5系列:HTML5表單HTML
- HTML5中的表單HTML
- 簡單的自定義表單控制元件控制元件
- Bootstrap 4 表單案例boot
- JavaScript學習14:表單處理JavaScript
- 實戰表單驗證學習
- jQuery獲取表單值及幾個表單事件jQuery事件
- 走進AngularJs(九)表單及表單驗證AngularJS
- JavaScript遍歷HTML表單元素及表單定義JavaScriptHTML
- ExtJS 3.4 表單控制元件JS控制元件
- Flutter學習筆記(13)--表單元件Flutter筆記元件
- jQuery 表單驗證 學習手記jQuery
- Ext學習筆記9-表單筆記
- 表單事件與鍵盤事件學習事件
- HTML表單元素及CSSHTMLCSS
- HTML5中常用表單整理HTML
- html5之新增表單屬性HTML
- 初學 Bootstrap 表單boot
- AngularJS自定義表單控制元件AngularJS控制元件
- bootstrap26-表單控制元件大小boot控制元件
- IdentityServer4學習及簡單使用IDEServer
- django book2 表單學習筆記Django筆記
- angular學習筆記(二十)-表單驗證Angular筆記
- Symfony2學習筆記之表單筆記
- Ext學習筆記10-表單續筆記
- 第九章 表單和登陸爬蟲爬蟲
- 線性表學習(4)
- 常見HTML5新增表單特性演示HTML
- HTML5的新的表單屬性HTML
- HTML5表單資訊驗證工作原理HTML
- HTML5表單新增元素與屬性HTML
- 全新改進的HTML5表單建立HTML