HTML 列表<datalist>
<datalist>雖然也可以生成列表，但是不能獨立使用這個表單。<datalist>標記必須和一個可輸入文本框類型一起配合使用。
基本語法：
<input type="text"list="要綁定的datalist的id"name="名稱"/>
<datalist id=列表 id>
<option label="列表項的說明1"value="列表項的值1"/>
......
<option label="列表項的說明n"value="列表項的值n"/>
</datalist>
語法說明：
<input>文本框表單要和下面的<datalist>一起搭配使用，所以<input>的list屬性要設(shè)定為<datalist>的id值；
<datalist></datalist>標記只用來標記列表的區(qū)域范圍；
<option>標記的作用是生成列表中的每一項，<option>標記的label屬性設(shè)置列表項的標記，<option>標記的value屬性設(shè)定列表項的取值。
在設(shè)置option元素時，必須設(shè)置value屬性，而label屬性則可以省略。
本例是使用<datalist>列表，當(dāng)用戶在文本框準備輸入時，輸入表單下面就會顯示出列表供用戶參考。
代碼如下：
<!DOCTYPE html>
<html>
<head>
<title>列表</title>
</head>
<body>
<form>
Webpage: <input type="url" list="url_list" name="link"/>
<datalist id="url_list">
<option label="W3School" value="http://www.W3School.com.cn"/>
<option label="Google" value="http://www.google.com"/>
<option label="Microsoft" value="http://www.microsoft.com"/>
</datalist>
</form>
</body>
</html>
湘公網(wǎng)安備:43011102000856號 
點擊加載更多評論>>