HTML-form表單相關概念

form表單有什么作用?有哪些常用的input標簽豫缨,分別有什么作用独令?

表單用于向服務器傳送數(shù)據(jù)。

常見的input標簽:

  • <input type="text"> 創(chuàng)建一個文本輸入框好芭,單行輸入燃箭。
  • <input type="password"> 同type="text”,但是輸入的內容顯示成小圓點
  • <input type="checkbox"> 創(chuàng)建一個復選框,可以勾選多個
  • <input type="radio"> 創(chuàng)建一個單選按鈕舍败,只能夠選一個
  • <input type="file"> 創(chuàng)建一個上傳文件按鈕招狸,可以上傳文件,通過添加accept屬性可以限制文件上傳種類
  • <input type="hidden"> 通過添加屬性(value邻薯,name等)使得這些屬性以隱藏的形式傳送到服務器
  • <input type="submit"> 創(chuàng)建一個提交按鈕瓢颅,可以通過value編輯按鈕要顯示的文字
  • <input type="reset"> 創(chuàng)建一個重置按鈕,可以通過nvlue編輯按鈕要顯示的文字
  • <iinput type="button"> 創(chuàng)建一個按鈕弛说,沒有作用挽懦,可以通過nvlue編輯按鈕要顯示的文字

post和get 方式的區(qū)別

post和get是form標簽中method屬性的值,method屬性可設置或返回用于表單提交的 HTTP 方法木人。

  1. Get是從服務器上得到數(shù)據(jù)信柿,而Post是往服務器傳送數(shù)據(jù)。

  2. Get將表單中數(shù)據(jù)的按照variable=value的形式醒第,添加到action所指向的URL后面渔嚷,并且兩者使用“?”連接,而各個變量之間使用“&”連接稠曼;Post是將表單中的數(shù)據(jù)放在form的數(shù)據(jù)體中形病,按照變量和值相對應的方式,傳遞到action所指向URL。

  3. 由于URL的長度有限制漠吻,所以Get能傳送的數(shù)據(jù)量很小量瓜,而Post沒有這個限制,傳送的數(shù)據(jù)量較大途乃。

  4. 由于Get在URL中可以看到提交到表單中的數(shù)據(jù)绍傲,使得其安全性很差,而Post的傳送是不可見的耍共,安全性相對高烫饼。

  5. Get限制Form表單收集的數(shù)據(jù)的值必須為ASCII,而Post支持整個ISO10646字符集试读。

在input中杠纵,name有什么作用?

name即命名钩骇,規(guī)定input元素的名稱比藻,用于對提交到服務器的表單數(shù)據(jù)進行標識,或者在客戶端通過 JavaScript 引用表單數(shù)據(jù)伊履,特別的韩容,只有設置了name屬性的表單元素才能在提交表單時傳遞他們的值款违。

radio如何分組唐瀑?

例:<input type="radio" name="sex" value="boy">男
<input type="radio" name="sex" value="girl">女
首先type="radio",表示創(chuàng)建一個單選按鈕,name="sex"插爹,給這個元素命名哄辣,以便提交表單時能傳遞這個值,value="boy",設置這個元素在傳遞到服務器時的值的名稱赠尾,“男”力穗,寫在標簽外,在瀏覽器中顯示在單選按鈕旁邊气嫁,告訴用戶信息当窗。若是有很多選擇,每一個寫一個<input type="radio">寸宵。

若是有多個不同的問題需要單選崖面,各個問題之間用<div></div>,即各個問題單獨為一塊。

placeholder屬性有什么作用梯影?

在文本框中顯示一行文字巫员,當用戶輸入的時候,文字會消失甲棍,一般這行文字可以提示用戶輸入規(guī)則和內容简识。

type="hidden"隱藏域有什么作用?舉例說明。

<input type="hidden"> 通過添加屬性(value七扰,name等)使得這些屬性以隱藏的形式傳送到服務器奢赂。

用于確認用戶的身份。例:
<form action="URL" method="post">
<div class="textarea">
<textarea name="artical" placeholder="你可以在這里寫東西"></textarea>
<input type="hidden" name="這里是隱藏的" value="123456">
<input type="submit" value="提交">
</div>
</form>
如果有<input type="hidden">當用戶提交后戳寸,可以在右下角看到“這里是隱藏的:123456”這句話

例1.png

而如果沒有<input type="hidden">呈驶,提交后就沒有那行文字,

例2.png

可以看到疫鹊,雖然在瀏覽器的界面是沒有“這里是隱藏的:123456”這句話袖瞻,但是提交的時候如果加上<input type="hidden">,那么這個屬性值就會被上傳到服務器拆吆,這樣聋迎,就可以確認用戶的身份。

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯(lián)系作者
  • 序言:七十年代末枣耀,一起剝皮案震驚了整個濱河市霉晕,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌捞奕,老刑警劉巖牺堰,帶你破解...
    沈念sama閱讀 221,198評論 6 514
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異颅围,居然都是意外死亡伟葫,警方通過查閱死者的電腦和手機,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 94,334評論 3 398
  • 文/潘曉璐 我一進店門院促,熙熙樓的掌柜王于貴愁眉苦臉地迎上來筏养,“玉大人,你說我怎么就攤上這事常拓〗ト埽” “怎么了?”我有些...
    開封第一講書人閱讀 167,643評論 0 360
  • 文/不壞的土叔 我叫張陵弄抬,是天一觀的道長茎辐。 經(jīng)常有香客問我,道長掂恕,這世上最難降的妖魔是什么拖陆? 我笑而不...
    開封第一講書人閱讀 59,495評論 1 296
  • 正文 為了忘掉前任,我火速辦了婚禮竹海,結果婚禮上慕蔚,老公的妹妹穿的比我還像新娘。我一直安慰自己斋配,他們只是感情好孔飒,可當我...
    茶點故事閱讀 68,502評論 6 397
  • 文/花漫 我一把揭開白布灌闺。 她就那樣靜靜地躺著,像睡著了一般坏瞄。 火紅的嫁衣襯著肌膚如雪桂对。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 52,156評論 1 308
  • 那天鸠匀,我揣著相機與錄音蕉斜,去河邊找鬼。 笑死缀棍,一個胖子當著我的面吹牛宅此,可吹牛的內容都是我干的。 我是一名探鬼主播爬范,決...
    沈念sama閱讀 40,743評論 3 421
  • 文/蒼蘭香墨 我猛地睜開眼父腕,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了青瀑?” 一聲冷哼從身側響起璧亮,我...
    開封第一講書人閱讀 39,659評論 0 276
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎斥难,沒想到半個月后枝嘶,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 46,200評論 1 319
  • 正文 獨居荒郊野嶺守林人離奇死亡哑诊,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 38,282評論 3 340
  • 正文 我和宋清朗相戀三年群扶,在試婚紗的時候發(fā)現(xiàn)自己被綠了。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片搭儒。...
    茶點故事閱讀 40,424評論 1 352
  • 序言:一個原本活蹦亂跳的男人離奇死亡穷当,死狀恐怖提茁,靈堂內的尸體忽然破棺而出淹禾,到底是詐尸還是另有隱情,我是刑警寧澤茴扁,帶...
    沈念sama閱讀 36,107評論 5 349
  • 正文 年R本政府宣布铃岔,位于F島的核電站,受9級特大地震影響峭火,放射性物質發(fā)生泄漏毁习。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點故事閱讀 41,789評論 3 333
  • 文/蒙蒙 一卖丸、第九天 我趴在偏房一處隱蔽的房頂上張望纺且。 院中可真熱鬧,春花似錦稍浆、人聲如沸载碌。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,264評論 0 23
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽嫁艇。三九已至朗伶,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間步咪,已是汗流浹背论皆。 一陣腳步聲響...
    開封第一講書人閱讀 33,390評論 1 271
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留猾漫,地道東北人点晴。 一個月前我還...
    沈念sama閱讀 48,798評論 3 376
  • 正文 我出身青樓,卻偏偏與公主長得像悯周,于是被迫代替她去往敵國和親觉鼻。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 45,435評論 2 359

推薦閱讀更多精彩內容

  • <input>標簽 標簽用于搜集用戶信息队橙,根據(jù)不同的type屬性值坠陈,輸入字段擁有很多種形式。輸入字段可以是文本字段...
    _空空閱讀 4,027評論 0 3
  • Spring Cloud為開發(fā)人員提供了快速構建分布式系統(tǒng)中一些常見模式的工具(例如配置管理捐康,服務發(fā)現(xiàn)仇矾,斷路器,智...
    卡卡羅2017閱讀 134,693評論 18 139
  • 什么是FORM表單: 表單是用來提交資料解总、意見贮匕,規(guī)范流程執(zhí)行過程的格式。表單在網(wǎng)頁中主要負責數(shù)據(jù)采集功能花枫。一個表單...
    PYFang閱讀 1,137評論 0 0
  • 1.form表單有什么作用刻盐?有哪些常用的input 標簽,分別有什么作用劳翰? HTML 表單用于接收不同類型的用戶輸...
    大胡子歌歌閱讀 884評論 0 1
  • 很多人會說自己是個吃貨敦锌,但是大家知道吃貨的本質嗎? 不是除了吃就是吃佳簸,這是簡單的長肉乙墙,也不是各種胡吃海塞,更多的是...
    梔虞先生閱讀 214評論 0 0