form表單

1.Text input(文本輸入框)是用來(lái)獲得用戶輸入的絕佳方式。
格式:
<input type="text">
input元素是自關(guān)閉的
詳細(xì)解析:http://www.w3school.com.cn/tags/tag_input.asp

2.占位符(placeholder text)是用戶在input(輸入)框輸入任何東西之前放置在input(輸入)框中的預(yù)定義文本。
格式:
<input type="text" placeholder="this is placeholder text">

3.使用HTML來(lái)構(gòu)建可以跟服務(wù)器交互的Web表單(form),通過(guò)給你的form元素添加一個(gè)action屬性來(lái)達(dá)到此目的。
action屬性的值指定了表單提交到服務(wù)器的地址
格式:
<form action="/url-where-you-want-to-submit-form-data"></form>

4.讓我們來(lái)為你的form添加一個(gè)submit(提交)按鈕,點(diǎn)擊這個(gè)按鈕,表單中的數(shù)據(jù)將會(huì)被發(fā)送到你通過(guò)action屬性指定的地址上。
格式:
<button type="submit">this button submits the form</button>
在form元素內(nèi)

5.當(dāng)你設(shè)計(jì)表單時(shí),你可以指定某些選項(xiàng)為必填項(xiàng)(required),只有當(dāng)用戶填寫了該選項(xiàng)后,用戶才能夠提交表單。
例如,如果你想把一個(gè)文本輸入字段設(shè)置為必填項(xiàng),在你的input元素中加上required屬性就可以了。
格式:
<input type="text" required>
注意:required屬性在Safari瀏覽器中不起作用,請(qǐng)用其他瀏覽器來(lái)學(xué)習(xí),推薦使用Chrome

6.多選一的場(chǎng)景就用radio button(單選按鈕)
每一個(gè)單選按鈕都應(yīng)該嵌套在它自己的label(標(biāo)簽)元素中。
注意:所有關(guān)聯(lián)的單選按鈕應(yīng)該使用相同的name屬性
格式:
<label><input type="radio" name="indoor-outdoor"> Indoor</label>
在form元素內(nèi)

7.checkboxes(復(fù)選按鈕)。
復(fù)選按鈕是input的輸入框的另一種類型。
每一個(gè)復(fù)選按鈕都應(yīng)該嵌套進(jìn)label元素中。
所有關(guān)聯(lián)的復(fù)選按鈕應(yīng)該具有相同的name屬性。
格式:
<label><input type="checkbox" name="personality"> Loving</label>
在form元素內(nèi)

8.使用checked屬性,你可以設(shè)置復(fù)選按鈕和單選按鈕默認(rèn)被選中。
為此,只需在input元素中添加屬性checked
格式:
<input type="radio" name="test-name" checked>

最后編輯于
?著作權(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)書系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

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

  • 本人做php的,最近發(fā)現(xiàn)JS真的是博大精深啊,比PHP難.在HTML中,表單是由form元素來(lái)表示的,但是在jav...
    linfree閱讀 2,331評(píng)論 3 17
  • 什么是FORM表單: 表單是用來(lái)提交資料、意見,規(guī)范流程執(zhí)行過(guò)程的格式。表單在網(wǎng)頁(yè)中主要負(fù)責(zé)數(shù)據(jù)采集功能。一個(gè)表單...
    PYFang閱讀 1,228評(píng)論 0 0
  • 1.form表單有什么作用?有哪些常用的input 標(biāo)簽,分別有什么作用? HTML 表單用于接收不同類型的用戶輸...
    大胡子歌歌閱讀 976評(píng)論 0 1
  • form簡(jiǎn)介 是HTML中的一個(gè)元素,它表示文檔中的一個(gè)區(qū)域,這個(gè)區(qū)域包含了交互控件,用于向web服務(wù)器提交信息。...
    七里之境閱讀 1,503評(píng)論 0 1
  • 一.什么是< form>表單 格式: 作用:form表單一般用來(lái)收集用戶的信息,并把信息傳送到后臺(tái)。 注意點(diǎn):1....
    饑人谷_劉沖閱讀 2,919評(píng)論 0 1

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