關(guān)鍵字:
form表單作用;
常用input標(biāo)簽;
post 和 get 區(qū)別;
radio分組;
placeholder作用;
type-hidden;
form表單有什么作用?
我們平時(shí)填寫(xiě)的紙質(zhì)表單一樣,HTML 表單用于搜集不同類型的用戶輸入
表單是一個(gè)包含表單元素的區(qū)域 表單元素是允許用戶在表單中(比如:文本域、下拉列表、單選框、復(fù)選框等等)輸入信息的元素
有哪些常用的input 標(biāo)簽,分別有什么作用?
<input> 標(biāo)簽規(guī)定了用戶可以在其中輸入數(shù)據(jù)的輸入字段。
<input> 元素在 <form> 元素中使用,用來(lái)聲明允許用戶輸入數(shù)據(jù)的 input 控件。
輸入字段可通過(guò)多種方式改變,取決于 type 屬性。
常用的input 標(biāo)簽:
accept 屬性 :規(guī)定了可通過(guò)文件上傳提交的服務(wù)器接受的文件類型。
注意:accept 屬性僅適用于 <input type="file">。alt 屬性: 為用戶由于某些原因(比如網(wǎng)速太慢、src 屬性中的錯(cuò)誤、瀏覽器禁用圖像、用戶使用的是屏幕閱讀器)無(wú)法查看圖像時(shí)提供了替代文本。
注意:alt 屬性只能與 <input type="image"> 配合使用。checked 屬性是一個(gè)布爾屬性。
checked 屬性規(guī)定在頁(yè)面加載時(shí)應(yīng)該被預(yù)先選定的 <input> 元素。
checked 屬性適用于 <input type="checkbox"> 和 <input type="radio">。
checked 屬性也可以在頁(yè)面加載后,通過(guò) JavaScript 代碼進(jìn)行設(shè)置。disabled 屬性是一個(gè)布爾屬性。
disabled 屬性規(guī)定應(yīng)該禁用的 <input> 元素。
被禁用的 input 元素是無(wú)法使用和無(wú)法點(diǎn)擊的。
表單中被禁用的 <input> 元素不會(huì)被提交name 屬性規(guī)定 <input> 元素的名稱。
name 屬性用于在 JavaScript 中引用元素,或者在表單提交后引用表單數(shù)據(jù)。
注意:只有設(shè)置了 name 屬性的表單元素才能在提交表單時(shí)傳遞它們的值。size 屬性規(guī)定以字符數(shù)計(jì)的 <input> 元素的可見(jiàn)寬度。
注意:size 屬性適用于下面的 input 類型:text、search、tel、url、email 和 password。src 屬性規(guī)定顯示為提交按鈕的圖像的 URL。
注意:src 屬性對(duì)于 <input type="image"> 是必需的屬性,且只能與 <input type="image"> 配合使用。type 屬性規(guī)定要顯示的 <input> 元素的類型。
默認(rèn)類型是:text。
提示:該屬性不是必需的,但是我們認(rèn)為您應(yīng)該始終使用它。value 屬性規(guī)定 <input> 元素的值。
value 屬性對(duì)于不同 input 類型,用法也不同:
對(duì)于 "button"、"reset"、"submit" 類型 - 定義按鈕上的文本
對(duì)于 "text"、"password"、"hidden" 類型 - 定義輸入字段的初始(默認(rèn))值
對(duì)于 "checkbox"、"radio"、"image" 類型 - 定義與 input 元素相關(guān)的值,當(dāng)提交表單時(shí)該值會(huì)發(fā)送到表單的 action URL。
注意:value 屬性對(duì)于 <input type="checkbox"> 和 <input type="radio"> 是必需的。
注意:value 屬性不適用于 <input type="file">。
post 和 get 方式的區(qū)別?
兩種 HTTP 請(qǐng)求方法:GET 和 POST
在客戶機(jī)和服務(wù)器之間進(jìn)行請(qǐng)求-響應(yīng)時(shí),兩種最常被用到的方法是:GET 和 POST。
GET - 從指定的資源請(qǐng)求數(shù)據(jù)。
POST - 向指定的資源提交要被處理的數(shù)據(jù)。
GET 方法
請(qǐng)注意,查詢字符串(名稱/值對(duì))是在 GET 請(qǐng)求的 URL 中發(fā)送的:
/test/demo_form.php?name1=value1&name2=value2
有關(guān) GET 請(qǐng)求的其他一些注釋:
GET 請(qǐng)求可被緩存
GET 請(qǐng)求保留在瀏覽器歷史記錄中
GET 請(qǐng)求可被收藏為書(shū)簽
GET 請(qǐng)求不應(yīng)在處理敏感數(shù)據(jù)時(shí)使用
GET 請(qǐng)求有長(zhǎng)度限制
GET 請(qǐng)求只應(yīng)當(dāng)用于取回?cái)?shù)據(jù)
POST 方法
請(qǐng)注意,查詢字符串(名稱/值對(duì))是在 POST 請(qǐng)求的 HTTP 消息主體中發(fā)送的:
POST /test/demo_form.php HTTP/1.1
Host: w3cschool.cc
name1=value1&name2=value2
有關(guān) POST 請(qǐng)求的其他一些注釋:
POST 請(qǐng)求不會(huì)被緩存
POST 請(qǐng)求不會(huì)保留在瀏覽器歷史記錄中
POST 不能被收藏為書(shū)簽
POST 請(qǐng)求對(duì)數(shù)據(jù)長(zhǎng)度沒(méi)有要求
POST和GET區(qū)別

在input里,name 有什么作用?
只有設(shè)置了 name 屬性的表單元素才能在提交表單時(shí)傳遞它們的值。
網(wǎng)頁(yè)檢查元素的請(qǐng)求數(shù)據(jù)格式為name:xxx
radio 如何 分組?
radio通過(guò)對(duì)name的定義來(lái)進(jìn)行分組,同一個(gè)name的radio只能單選。
placeholder 屬性有什么作用?
為輸入框提供提示功能的占位文字,比如:請(qǐng)輸入密碼
placeholder 屬性規(guī)定可描述輸入字段預(yù)期值的簡(jiǎn)短的提示信息(比如:一個(gè)樣本值或者預(yù)期格式的短描述)。
該提示會(huì)在用戶輸入值之前顯示在輸入字段中。
注意:placeholder 屬性適用于下面的 input 類型:text、search、url、tel、email 和 password。
type=hidden隱藏域有什么作用? 舉例說(shuō)明
Hidden 對(duì)象代表一個(gè) HTML 表單中的某個(gè)隱藏輸入域。
這種類型的輸入元素實(shí)際上是隱藏的。這個(gè)不可見(jiàn)的表單元素的** value 屬性**保存了一個(gè)要提交給 Web 服務(wù)器的任意字符串。如果想要提交并非用戶直接輸入的數(shù)據(jù)的話,就是用這種類型的元素。
在 HTML 表單中 <input type="hidden"> 標(biāo)簽每出現(xiàn)一次,一個(gè) Hidden 對(duì)象就會(huì)被創(chuàng)建。
Paste_Image.png
表單驗(yàn)證
JavaScript 可用來(lái)在數(shù)據(jù)被送往服務(wù)器前對(duì) HTML 表單中的這些輸入數(shù)據(jù)進(jìn)行驗(yàn)證。
數(shù)據(jù)是否為空.
email地址
驗(yàn)證日期是否輸入正確?
表單輸入內(nèi)容是否為數(shù)字型?
