1、form表單有什么作用?有哪些常用的input 標(biāo)簽,分別有什么作用?
form表單的作用就是用于收集以前寫的一些信息,然后提交給網(wǎng)站后臺(tái)。
input 標(biāo)簽,分別有什么作用?
(1)text 類型
普通文本
(2)password 類型
輸入密碼框,輸入的字符自動(dòng)變?yōu)辄c(diǎn)。以防他人竊取信息
(3)checkbox 類型
checkbox 輸入復(fù)選框,可以選擇不只一個(gè)
(4)radio 類型
輸入單選框,只能選擇一個(gè)
(5)file 類型
上傳文件
(6)submit 類型
提交表單
(7)button 類型
能點(diǎn)擊,但不會(huì)提交
(8)reset 類型
重置表單
(9)hidden類型
這個(gè)輸入框是隱藏的。
(10)菜單<select>
選項(xiàng)列表
(11)<textarea>
可輸入多行文本
2、post 和 get 方式的區(qū)別?
關(guān)于方式上
對(duì)于get方式當(dāng)瀏覽器向服務(wù)器發(fā)送請(qǐng)求的時(shí)候,它會(huì)把所有請(qǐng)求數(shù)據(jù)把它拼接成key=value的形式連接到一起然后組裝到url上。
對(duì)post請(qǐng)求 這個(gè)url不會(huì)發(fā)生變化,但是數(shù)據(jù)會(huì)被發(fā)送到后臺(tái)。關(guān)于安全性
get方式不安全 密碼會(huì)被傳送到url上,很容易泄露
post方式更為安全數(shù)據(jù)量的要求
get 有限制
post 沒(méi)有限制
3、在input里,name 有什么作用?
我們整理數(shù)據(jù)給后端的時(shí)候,會(huì)把所有東西組成key value的
形式,而這個(gè)key值,就是name的值。
所以所有的input都要加上name,否則就是白寫。
4、radio 如何 分組?
通過(guò)設(shè)置name值, name值相同的為一個(gè)組
5、placeholder 屬性有什么作用?
輸入提示
6、type=hidden隱藏域有什么作用? 舉例說(shuō)明
(1)隱藏域在頁(yè)面中對(duì)于用戶是不可見(jiàn)得,在表單中插入隱藏域的目的在于收集或發(fā)送信息,以利于
被處理表單的程序使用。瀏覽器者單擊發(fā)送按鈕發(fā)送表單時(shí)候,隱藏域的信息也被一起發(fā)送到服務(wù)器。
(2)后端接收前端傳來(lái)的數(shù)據(jù),需要確認(rèn)前端的身份,是本公司的網(wǎng)頁(yè)傳來(lái)的數(shù)據(jù),而不是
其他黑客知道后端地址后傳來(lái)的假數(shù)據(jù),那么就加一個(gè)隱藏域。驗(yàn)證value里的值和數(shù)據(jù)庫(kù)的name
值是不是對(duì)應(yīng)的。
(3)有時(shí)候一個(gè)form里有多個(gè)提交按鈕,怎樣使程序能夠分清楚到底用戶是按那個(gè)
按鈕提交上來(lái)的呢,我們就可以通過(guò)寫一個(gè)隱藏域,然后在每個(gè)按鈕處加上onclick="document.form.command.value ="xx""
然后先檢查command的值就會(huì)知道用戶是按那個(gè)按鈕提交上來(lái)的。
(4)有時(shí)候一個(gè)網(wǎng)頁(yè)中有多個(gè)form,我們知道多個(gè)forms是不能同時(shí)提交的,
但是有時(shí)這些form確實(shí)相互作用,我們就可以在form中添加隱藏域來(lái)使它們聯(lián)系起來(lái)。
(5)JavaScript不支持全局變量,但有時(shí)我們必須用全局變量,我們就可以先把值存在隱藏域里,
它的值就不會(huì)丟失了。
(6)比如按一個(gè)按鈕彈出四個(gè)小窗口,當(dāng)點(diǎn)擊其中一個(gè)小窗口時(shí)其他的三個(gè)自動(dòng)
關(guān)閉,可是IE不支持小窗口相互調(diào)用,所以只有在父窗口寫個(gè)隱藏域,當(dāng)小窗口
看到那個(gè)隱藏域的值是close時(shí)就自己關(guān)掉。
寫一篇博客簡(jiǎn)單介紹 HTML 表單的用法,附上博客鏈接
博客鏈接
實(shí)現(xiàn)如下表單,附上預(yù)覽地址。其中性別和取向是單選,愛(ài)好是多選。
預(yù)覽