HTML表單使用方法

Html中的form表單常用于用戶信息的填寫和提交,在前端開發(fā)中使用較為廣泛。

form對象

建立一個form表單,提交方式method設(shè)置為郵件發(fā)送,自動填寫autocomplete打開,填寫驗證novalidate打開

<form action="" method="post" autocomplete="on" novalidate="novalidate"></form>

label對象

屬性:

  • for: 指明綁定控件的id.
  • formid: 指明所屬的一個或多個表單

<label for="username">姓名:</label> <input id="username" type="text" name="username" placeholder="用戶名">

text對象

注意一旦 disabled=true, POST后就沒有值,對于別的空間也是

<input id="username" type="text" name="username" placeholder="用戶名">

textarea對象

屬性和方法:

  • rows: 顯示行數(shù). 輸入超過了就下拉
  • cols: 寬度.
  • height/width: 也可以控制大小.
  • readonly: 只讀的.
  • disabled: 不可用,true/false.
  • name: 名稱,用于表單調(diào)用.
  • required: 必須填的.HTML5.
  • maxlength: 最大字符數(shù)
  • form: 所屬的一個或多個表單.

<textarea name="comments" placeholder="ddd" cols="80" rows="20"></textarea>

password對象

<input id="password" type="password" name="password">

radio對象

屬性:

  • checked: 被選中. 也用來最終獲取值

<label><input name="Fruit" type="radio" value="" checked/>蘋果 </label>
<label><input name="Fruit" type="radio" value="" />桃子 </label>
<label><input name="Fruit" type="radio" value="" />香蕉 </label>
<label><input name="Fruit" type="radio" value="" />梨 </label>
<label><input name="Fruit" type="radio" value="" />其它 </label>


##checkbox對象
屬性:
- checked: 被選中. 也用來最終獲取值
> ```
<label><input name="Fruit1" type="checkbox" value="" checked/>蘋果 </label> 
<label><input name="Fruit2" type="checkbox" value="" />桃子 </label> 
<label><input name="Fruit3" type="checkbox" value="" />香蕉 </label> 
<label><input name="Fruit4" type="checkbox" value="" />梨 </label> 

select對象

常用屬性事件:

  • text: 顯示內(nèi)容
  • value: 具體值
  • index: 返回索引值(下拉時位置)
  • selected: 是否被選中,可以用于默認值

<select id="sel">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
</select>


##hidden對象
一般用于儲存一些不顯示的信息,又可以通過JS進行操作修改,保存內(nèi)容,被進一步調(diào)用等
> `<input type="hidden" name="country" value="Norway" />`
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

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

  • 定義和用法 標簽用于為用戶輸入創(chuàng)建 HTML 表單。表單能夠包含input 元素,比如文本字段、復選框、單選框、...
    任少鵬閱讀 600評論 0 0
  • 表單的作用 HTML 表單用于接收不同類型的用戶輸入,用戶提交表單時向服務(wù)器傳輸數(shù)據(jù),從而實現(xiàn)用戶與Web服務(wù)器的...
    柏龍閱讀 200評論 0 1
  • form簡介 是HTML中的一個元素,它表示文檔中的一個區(qū)域,這個區(qū)域包含了交互控件,用于向web服務(wù)器提交信息。...
    七里之境閱讀 1,503評論 0 1
  • HTML標簽解釋大全 一、HTML標記 標簽:!DOCTYPE 說明:指定了 HTML 文檔遵循的文檔類型定義(D...
    米塔塔閱讀 3,530評論 1 41
  • 0.B/S結(jié)構(gòu) 瀏覽器服務(wù)器模式,web瀏覽器是客戶端最主要的應(yīng)用軟件.將客戶端使用web進行統(tǒng)一,系統(tǒng)功能實現(xiàn)集...
    liusong007閱讀 1,202評論 0 1

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