input 標(biāo)簽詳解

常用的input標(biāo)簽

  • button

一個(gè)沒(méi)有默認(rèn)行為的推送按鈕

  • checkbox

一個(gè)被選中的盒子,必須使用value屬性來(lái)確定被提交的數(shù)據(jù) 用checked屬性確認(rèn)checkbox是否被選中

  • file

可以讓用戶選擇一個(gè)文件,accept屬性限制了能夠選擇文件的類型。

  • hidden

一種不被顯示但是里面的值會(huì)被傳到后臺(tái)

  • image

一個(gè)圖形化的提交按鈕,必須使用src屬性來(lái)指定圖片的地址和alt屬性來(lái)說(shuō)明圖片未被正確顯示時(shí)對(duì)圖片的描述,也可以使用width和height屬性來(lái)設(shè)置圖片的大小

  • password

一個(gè)單線的文板框,里面的文本是被遮住的,用maxlength屬性來(lái)定義可以輸入文本的最大長(zhǎng)度

  • radio

單選按鈕,必須使用value屬性來(lái)確定被提交的數(shù)據(jù)使用checked讓radio默認(rèn)被選中。在一個(gè)單選框組里面,每個(gè)單選按鈕必須使用一個(gè)name值,只有一個(gè)單選框能被選中。

  • reset

一個(gè)可以重置form表單里所有默認(rèn)值的按鈕.

  • submit

用來(lái)提交form信息的按鈕。

  • text

一個(gè)單線文本框,自動(dòng)從輸入值中刪除換行符。

  • required

此屬性input標(biāo)簽必填.

  • minlength

input標(biāo)簽的最小字節(jié)長(zhǎng)度

  • maxlength

input標(biāo)簽的最大字節(jié)長(zhǎng)度

  • pattern

正則表達(dá)式用于驗(yàn)證input標(biāo)簽里的值


在input里,name 有什么作用?

name 屬性規(guī)定 input 元素的名稱。
name 屬性用于對(duì)提交到服務(wù)器后的表單數(shù)據(jù)進(jìn)行標(biāo)識(shí),或者在客戶端通過(guò) JavaScript 引用表單數(shù)據(jù)。

注釋:只有設(shè)置了 name 屬性的表單元素才能在提交表單時(shí)傳遞它們的值。


radio 如何 分組?

使用相同name值的radio為同組。


placeholder 屬性有什么作用?

placeholder 屬性規(guī)定可描述輸入字段預(yù)期值的簡(jiǎn)短的提示信息(比如:一個(gè)樣本值或者預(yù)期格式的短描述)。
該提示會(huì)在用戶輸入值之前顯示在輸入字段中。


type=hidden隱藏域有什么作用? 舉例說(shuō)明

  1. 隱藏域在頁(yè)面中對(duì)于用戶是不可見(jiàn)的,在表單中插入隱藏域的目的在于收集或發(fā)送信息,以利于被處理表單的程序所使用。瀏覽者單擊發(fā)送按鈕發(fā)送表單的時(shí)候,隱藏域的信息也被一起發(fā)送到服務(wù)器。
  2. 有些時(shí)候一個(gè)form里有多個(gè)提交按鈕,怎樣使程序能夠分清楚到底用戶是按那一個(gè)按鈕提交上來(lái)的呢?我們就可以寫一個(gè)隱藏域,然后在每一個(gè)按鈕處加上onclick="document.form.command.value="xx""然后我們接到數(shù)據(jù)后先檢查command的值就會(huì)知道用戶是按的那個(gè)按鈕提交上來(lái)的。
  3. javascript不支持全局變量,但有時(shí)我們必須用全局變量,我們就可以把值先存在隱藏域里,它的值就不會(huì)丟失了。

例子: 使用hidden實(shí)現(xiàn)點(diǎn)擊提交按鈕數(shù)字加1

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書(shū)系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • <input>:用于收集用戶信息。 根據(jù)不同的 type 屬性值,輸入字段擁有很多種形式。輸入字段可以是文本字段、...
    PYFang閱讀 2,132評(píng)論 0 0
  • 什么是input? 標(biāo)簽用于搜集用戶信息。根據(jù)不同的 type 屬性值,輸入字段擁有很多種形式,輸入字段可以是文本...
    饑人谷_Dylan閱讀 1,372評(píng)論 0 50
  • 最近學(xué)習(xí)HTML的過(guò)程中遇到了input標(biāo)簽,作為一名前端初級(jí)學(xué)習(xí)者,其實(shí)我是不太了解的。既然不懂的話,就得深入的...
    饑人谷_enzo閱讀 1,766評(píng)論 0 0
  • HTML 元素用于為基于Web的表單創(chuàng)建交互式控件,以便接受來(lái)自用戶的數(shù)據(jù)。 在HTML表單中,input標(biāo)簽...
    shadow123閱讀 700評(píng)論 0 0
  • 標(biāo)簽用于搜集用戶信息,一般放在 標(biāo)簽下,根據(jù)不同的type屬性值,輸入字段擁有很多種形式,可以是文本、復(fù)選框、按鈕...
    饑人谷_Oneleven閱讀 2,242評(píng)論 1 2

友情鏈接更多精彩內(nèi)容