3-5. dalist標簽

1蹂风、<datalist> 標簽定義選項列表。請與 input 元素配合使用該元素沟沙,來定義 input 可能的值河劝。
作用: 給輸入框綁定待選項

2、datalist格式:

<datalist>
    <option>待選項內(nèi)容</option>
</datalist>

3矛紫、如何給輸入框綁定待選列表

  • 搞一個輸入框
  • 搞一個datalist列表
  • 給datalist列表標簽添加一個id
  • 給輸入框添加一個list屬性,將datalist的id對應(yīng)的值賦值給list屬性即可
<body>
<!--
datalist: 是為了給輸入框提供一些帶選項,也是一個復(fù)合標簽
格式:
    <datalist>
        <option >美國</option>
        <option >中國</option>
        <option >泰國</option>
    </datalist>
注意:
    1. 輸入框
    2. datalist
    3. 相互綁定: 輸入框要有一個屬性list=datalist的id值
    4. 雖然可以在帶選項中進行選擇,但是依然可以自己輸入不同的數(shù)據(jù)
-->
<form action="">
    請輸入你的國籍: <input type="text" list="country">

    <datalist id="country">
        <option >美國</option>
        <option >中國</option>
        <option >泰國</option>
    </datalist>
</form>
</body>
圖片.png

http://www.w3school.com.cn/tags/tag_datalist.asp

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末赎瞎,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子颊咬,更是在濱河造成了極大的恐慌务甥,老刑警劉巖牡辽,帶你破解...
    沈念sama閱讀 223,126評論 6 520
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異敞临,居然都是意外死亡态辛,警方通過查閱死者的電腦和手機,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 95,421評論 3 400
  • 文/潘曉璐 我一進店門挺尿,熙熙樓的掌柜王于貴愁眉苦臉地迎上來奏黑,“玉大人,你說我怎么就攤上這事票髓∨屎” “怎么了?”我有些...
    開封第一講書人閱讀 169,941評論 0 366
  • 文/不壞的土叔 我叫張陵洽沟,是天一觀的道長。 經(jīng)常有香客問我蜗细,道長裆操,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 60,294評論 1 300
  • 正文 為了忘掉前任炉媒,我火速辦了婚禮踪区,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘吊骤。我一直安慰自己缎岗,他們只是感情好,可當我...
    茶點故事閱讀 69,295評論 6 398
  • 文/花漫 我一把揭開白布白粉。 她就那樣靜靜地躺著传泊,像睡著了一般。 火紅的嫁衣襯著肌膚如雪鸭巴。 梳的紋絲不亂的頭發(fā)上眷细,一...
    開封第一講書人閱讀 52,874評論 1 314
  • 那天,我揣著相機與錄音鹃祖,去河邊找鬼溪椎。 笑死,一個胖子當著我的面吹牛恬口,可吹牛的內(nèi)容都是我干的校读。 我是一名探鬼主播,決...
    沈念sama閱讀 41,285評論 3 424
  • 文/蒼蘭香墨 我猛地睜開眼祖能,長吁一口氣:“原來是場噩夢啊……” “哼歉秫!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起芯杀,我...
    開封第一講書人閱讀 40,249評論 0 277
  • 序言:老撾萬榮一對情侶失蹤端考,失蹤者是張志新(化名)和其女友劉穎雅潭,沒想到半個月后,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體却特,經(jīng)...
    沈念sama閱讀 46,760評論 1 321
  • 正文 獨居荒郊野嶺守林人離奇死亡扶供,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 38,840評論 3 343
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現(xiàn)自己被綠了裂明。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片椿浓。...
    茶點故事閱讀 40,973評論 1 354
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖闽晦,靈堂內(nèi)的尸體忽然破棺而出扳碍,到底是詐尸還是另有隱情,我是刑警寧澤仙蛉,帶...
    沈念sama閱讀 36,631評論 5 351
  • 正文 年R本政府宣布笋敞,位于F島的核電站,受9級特大地震影響荠瘪,放射性物質(zhì)發(fā)生泄漏夯巷。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點故事閱讀 42,315評論 3 336
  • 文/蒙蒙 一哀墓、第九天 我趴在偏房一處隱蔽的房頂上張望趁餐。 院中可真熱鬧,春花似錦篮绰、人聲如沸后雷。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,797評論 0 25
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽臀突。三九已至,卻和暖如春走孽,著一層夾襖步出監(jiān)牢的瞬間惧辈,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 33,926評論 1 275
  • 我被黑心中介騙來泰國打工磕瓷, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留盒齿,地道東北人。 一個月前我還...
    沈念sama閱讀 49,431評論 3 379
  • 正文 我出身青樓困食,卻偏偏與公主長得像边翁,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子硕盹,可洞房花燭夜當晚...
    茶點故事閱讀 45,982評論 2 361

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

  • Spring Cloud為開發(fā)人員提供了快速構(gòu)建分布式系統(tǒng)中一些常見模式的工具(例如配置管理符匾,服務(wù)發(fā)現(xiàn),斷路器瘩例,智...
    卡卡羅2017閱讀 134,720評論 18 139
  • HTML需要掌握標簽 標簽(空格分隔): H5+CSS [TOC] 常用標簽 img 注意點 和H系列標簽/p標簽...
    袁俊亮技術(shù)博客閱讀 2,052評論 1 8
  • img標簽: img標簽中的img其實是英文image的縮寫,所以img標簽的作用, 就是告訴瀏覽器我們需要顯示一...
    佩佩216閱讀 1,496評論 0 2
  • HTML標簽解釋大全 一啊胶、HTML標記 標簽:!DOCTYPE 說明:指定了 HTML 文檔遵循的文檔類型定義(D...
    米塔塔閱讀 3,263評論 1 41
  • 一.產(chǎn)品分析 1.產(chǎn)品定位 58到家是一個提供到家服務(wù)的互聯(lián)網(wǎng)生活服務(wù)品牌甸各,為用戶提供專業(yè)、便捷焰坪、安心的標準化到家...
    運營自修社閱讀 17,936評論 2 31