HTML表單

<h5>form表單有什么作用?有哪些常用的input 標簽,分別有什么作用仇轻?</h5>
  1.form表單用于接收不同類型的用戶輸入奶甘,用戶提交表單時向服務(wù)器傳輸數(shù)據(jù)篷店,從而實現(xiàn)用戶與Web服務(wù)器的交互。
 〕艏摇2.常用input標簽有:
  text定義用于文本輸入的單行輸入字段(默認寬度為20個字符)疲陕;
  password定義密碼字段;
  submit定義用于向表單處理程序提交表單的按鈕钉赁;
  number用于應(yīng)該包含數(shù)字值的輸入字段蹄殃;
  button定義可點擊按鈕;
  radio定義單選按鈕你踩,允許用戶在有限數(shù)量的選項中選擇一個诅岩;
  checkbox復選框;
  color定義拾色器带膜,定義后出現(xiàn)顏色調(diào)板吩谦,只支持谷歌和opera;
  date定義 date 控件(包括年膝藕、月式廷、日,不包括時間)芭挽。只支持谷歌懒棉、opera、safari览绿;
  datetime定義date和time空間,僅支持safari策严、opera;
  datetime-local定義date和time空間饿敲。只支持谷歌妻导、opera、safari怀各;
  email定義用于e-mail地址字段倔韭,提交時會驗證。safari不支持瓢对;
  file上傳文件寿酌;
  hidden定義隱藏字段;
  image定義圖像為提交按鈕硕蛹;

<h5>post 和 get 方式的區(qū)別醇疼?</h5>
  1.本質(zhì)硕并。Get是向服務(wù)器索取數(shù)據(jù)的一種請求,而Post是向服務(wù)器提交數(shù)據(jù)的一種請求秧荆。
  2.服務(wù)器端獲取值的方法不同倔毙。get方式提交的數(shù)據(jù),服務(wù)器端使用
request.QueryString獲取變量的值乙濒。post方式提交的數(shù)據(jù)陕赃,服務(wù)器端使用request.Form獲取數(shù)據(jù)
  3.安全性。get方式安全性低颁股,post方式較安全么库。但是post方式執(zhí)行效率要比get方式差一些。
  4.機制甘有。get是把參數(shù)數(shù)據(jù)隊列加到提交表單的action屬性所指的URL
中诉儒。在URl中,值和表單各個字段一一對應(yīng)梧疲,并且這些對在URl中對用戶來說是可見的允睹。post是通過HTTP post機制,將表單內(nèi)各個字段與其內(nèi)容放置在HTML HEADER內(nèi)一起傳送到action屬性所指的URL地址幌氮,對于用戶來說缭受,這是透明的。
  5.大小该互。理論上講米者,POST是沒有大小限制的,HTTP協(xié)議規(guī)范也沒有進行大小限制宇智,起限制作用的是服務(wù)器的處理程序的處理能力蔓搞。

<h5>在input里,name 有什么作用随橘?</h5>
  name屬性規(guī)定input 元素的名稱,name 屬性用于對提交到服務(wù)器后的
表單數(shù)據(jù)進行標識喂分,或者在客戶端通過JavaScript引用表單數(shù)據(jù)。只有設(shè)置了 name 屬性的表單元素才能在提交表單時傳遞它們的值机蔗。

<h5>radio 如何分組?</h5>
  通過name屬性分組蒲祈,name相同的為一組。

<h5>placeholder 屬性有什么作用?</h5>
  placeholder 屬性提供可描述輸入字段預期值的提示信息萝嘁。該提示會
在輸入字段為空時顯示梆掸,并會在字段獲得焦點時消失。

<h5>type=hidden隱藏域有什么作用? 舉例說明</h5>
  隱藏域是用來收集或發(fā)送信息的不可見元素牙言,對于網(wǎng)頁的訪問者來說酸钦,隱藏域是看不見的。它不在網(wǎng)頁中顯示出來咱枉,主要用途是為網(wǎng)頁交互時存儲一些不需要在網(wǎng)頁顯示的數(shù)據(jù)卑硫。當表單被提交時徒恋,隱藏域就會將信息用你設(shè)置時定義的名稱和值發(fā)送到服務(wù)器上,這樣安全性較高拔恰。

<h5>簡單介紹 HTML 表單的用法</h5>
  1. 表單是一個包含表單元素的區(qū)域因谎,訪問一個包含表單的頁面基括,輸入數(shù)據(jù)后提交表單颜懊,瀏覽器將用戶在表單中輸入的數(shù)據(jù)進行打包并發(fā)送給服務(wù)器,服務(wù)器端程序就可以處理表單傳過來的數(shù)據(jù)风皿。
  表單使用<form>標簽創(chuàng)建河爹,<form>標簽是成對的,以</form>結(jié)束桐款。所有表單控件(文本框咸这、文本域、按鈕魔眨、單選框媳维、復選框等)都必須放在 <form></form> 標簽之間(否則用戶輸入的信息提交不到服務(wù)器上。
  2. 常用屬性有method,action遏暴。語法為<form method="傳送方式"  action="服務(wù)器文件">侄刽。action是瀏覽者輸入的數(shù)據(jù)被傳送到的地方。method是數(shù)據(jù)傳送的方式朋凉,分為get和post方式州丹,get是向服務(wù)器索取數(shù)據(jù)的一種請求,post是向服務(wù)器提交數(shù)據(jù)的一種請求杂彭。
  3.1 當用戶要在表單中鍵入字母墓毒、數(shù)字等內(nèi)容時,就會用到文本輸入框亲怠。文本框也可以轉(zhuǎn)化為密碼輸入框所计。
  <input type="text/password" name="名稱" value="文本" />當type="text"時,輸入框為文本輸入框;當type="password"時, 輸入框為密碼輸入框团秽。name:為文本框命名主胧,以備后臺程序ASP 、PHP使用徙垫。value:為文本輸入框設(shè)置默認值(一般起到提示作用)讥裤。
  3.2 當用戶需要在表單中輸入大段文字時,需要用到文本輸入域姻报。
  <textarea rows="行數(shù)" cols="列數(shù)">文本</textarea>己英。<textarea>標簽是成對出現(xiàn)的,以<textarea>開始吴旋,以</textarea>結(jié)束损肛。cols 為多行輸入域的列數(shù)循集。rows 為多行輸入域的行數(shù)。在<textarea></textarea>標簽之間可以輸入默認值征炼。
  3.3 在使用表單設(shè)計調(diào)查表時捷绑,為了減少用戶的操作,可以使用選擇框劫谅,html中有兩種選擇框见坑,即單選框和復選框,兩者的區(qū)別是單選框中的選項用戶只能選擇一項捏检,而復選框中用戶可以任意選擇多項荞驴,甚至全選。<input type="radio/checkbox" value="值" name="名稱" checked="checked"/>當 type="radio" 時控件為單選框贯城,type="checkbox" 時控件為復選框熊楼。value:提交數(shù)據(jù)到服務(wù)器的值。name:為控件命名能犯,以備后臺程序 ASP鲫骗、PHP 等使用。checked:當設(shè)置checked="checked" 時踩晶,該選項被默認選中执泰。
  3.4 下拉列表在網(wǎng)頁中也常會用到,它可以有效的節(jié)省網(wǎng)頁空間合瓢。既可以單選坦胶、又可以多選。比如:
  <label>愛好:</label>
  <select>
  <option value="看書">看書</option>
  <option value="旅游" selected="selected">旅游</option>
  <option value="運動">運動</option>
  <option value="購物">購物</option>
  </select>
  option value為向服務(wù)器提交的值晴楔,中間的為顯示的值顿苇。設(shè)置selected="selected"屬性,則該選項就被默認選中税弃。下拉列表也可以進行多選操作纪岁,在<select>標簽中設(shè)置multiple="multiple"屬性<select multiple="multiple">,就可以實現(xiàn)多選功能则果,在 windows 操作系統(tǒng)下幔翰,進行多選時按下Ctrl鍵同時進行單擊(在Mac下使用Command +單擊),可以選擇多個選項西壮。
  3.5 在表單中有兩種按鈕可以使用遗增,分別為:提交按鈕、重置款青。
當用戶需要提交表單信息到服務(wù)器時做修,需要用到提交按鈕。<input
type="submit" value="提交">只有當type值設(shè)置為submit時,按鈕才有提交作用饰及。當用戶需要重置表單信息到初始時的狀態(tài)時蔗坯,比如用戶輸入“用戶名”后,發(fā)現(xiàn)書寫有誤燎含,可以使用重置按鈕使輸入框恢復到初始狀態(tài)宾濒。只需要把type設(shè)置為"reset"就可以。<input type="reset" value="重置">只有當type值設(shè)置為reset時屏箍,按鈕才有重置作用绘梦。value為按鈕上顯示的文字。
  3.6 label標簽不會向用戶呈現(xiàn)任何特殊效果铣除,它的作用是為鼠標用戶改進了可用性谚咬。如果你在 label 標簽內(nèi)點擊文本鹦付,就會觸發(fā)此控件尚粘。就是說,當用戶單擊選中該label標簽時敲长,瀏覽器就會自動將焦點轉(zhuǎn)到和標簽相關(guān)的表單控件上(就自動選中和該label標簽相關(guān)連的表單控件上)郎嫁。<label for="控件id名稱">標簽的 for 屬性中的值應(yīng)當與相關(guān)控件的 id 屬性值一定要相同。

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末祈噪,一起剝皮案震驚了整個濱河市泽铛,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌辑鲤,老刑警劉巖盔腔,帶你破解...
    沈念sama閱讀 211,042評論 6 490
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異月褥,居然都是意外死亡弛随,警方通過查閱死者的電腦和手機,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 89,996評論 2 384
  • 文/潘曉璐 我一進店門宁赤,熙熙樓的掌柜王于貴愁眉苦臉地迎上來舀透,“玉大人,你說我怎么就攤上這事决左°倒唬” “怎么了?”我有些...
    開封第一講書人閱讀 156,674評論 0 345
  • 文/不壞的土叔 我叫張陵佛猛,是天一觀的道長惑芭。 經(jīng)常有香客問我,道長继找,這世上最難降的妖魔是什么遂跟? 我笑而不...
    開封第一講書人閱讀 56,340評論 1 283
  • 正文 為了忘掉前任,我火速辦了婚禮,結(jié)果婚禮上漩勤,老公的妹妹穿的比我還像新娘感挥。我一直安慰自己,他們只是感情好越败,可當我...
    茶點故事閱讀 65,404評論 5 384
  • 文/花漫 我一把揭開白布触幼。 她就那樣靜靜地躺著,像睡著了一般究飞。 火紅的嫁衣襯著肌膚如雪置谦。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 49,749評論 1 289
  • 那天亿傅,我揣著相機與錄音媒峡,去河邊找鬼。 笑死葵擎,一個胖子當著我的面吹牛谅阿,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播酬滤,決...
    沈念sama閱讀 38,902評論 3 405
  • 文/蒼蘭香墨 我猛地睜開眼签餐,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了盯串?” 一聲冷哼從身側(cè)響起氯檐,我...
    開封第一講書人閱讀 37,662評論 0 266
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎体捏,沒想到半個月后冠摄,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 44,110評論 1 303
  • 正文 獨居荒郊野嶺守林人離奇死亡几缭,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 36,451評論 2 325
  • 正文 我和宋清朗相戀三年河泳,在試婚紗的時候發(fā)現(xiàn)自己被綠了。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片奏司。...
    茶點故事閱讀 38,577評論 1 340
  • 序言:一個原本活蹦亂跳的男人離奇死亡乔询,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出韵洋,到底是詐尸還是另有隱情竿刁,我是刑警寧澤,帶...
    沈念sama閱讀 34,258評論 4 328
  • 正文 年R本政府宣布搪缨,位于F島的核電站食拜,受9級特大地震影響,放射性物質(zhì)發(fā)生泄漏副编。R本人自食惡果不足惜负甸,卻給世界環(huán)境...
    茶點故事閱讀 39,848評論 3 312
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧呻待,春花似錦打月、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,726評論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至迫淹,卻和暖如春秘通,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背敛熬。 一陣腳步聲響...
    開封第一講書人閱讀 31,952評論 1 264
  • 我被黑心中介騙來泰國打工肺稀, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人应民。 一個月前我還...
    沈念sama閱讀 46,271評論 2 360
  • 正文 我出身青樓话原,卻偏偏與公主長得像,于是被迫代替她去往敵國和親瑞妇。 傳聞我的和親對象是個殘疾皇子稿静,可洞房花燭夜當晚...
    茶點故事閱讀 43,452評論 2 348

推薦閱讀更多精彩內(nèi)容

  • <input>標簽 標簽用于搜集用戶信息,根據(jù)不同的type屬性值辕狰,輸入字段擁有很多種形式。輸入字段可以是文本字段...
    _空空閱讀 4,019評論 0 3
  • 1控漠、關(guān)于form表單的基礎(chǔ) form表單:是一個包含表單元素的區(qū)域蔓倍;作用,用于包裹表單元素盐捷。 表單元素:是允許用戶...
    tangmengyun閱讀 696評論 1 1
  • 1.有序列表碉渡、無序列表聚谁、自定義列表如何使用?寫個簡單的例子滞诺。三者在語義上有什么區(qū)別形导?在哪些情況下使用哪種(重要)?...
    進擊的阿群閱讀 1,404評論 2 2
  • 常見問題 form表單有什么作用习霹?有哪些常用的input 標簽朵耕,分別有什么作用? HTML 表單用于搜集不同類型的...
    JohnHank閱讀 421評論 0 0
  • form是HTML中比較重要的一塊內(nèi)容淋叶, 標簽用于為用戶輸入創(chuàng)建 HTML 表單阎曹,表單用于向服務(wù)器傳輸數(shù)據(jù)。 希望...
    jazenye閱讀 1,143評論 0 5