数据单datalists使用方法

时间：2014-7-3

   如果元素接受文本输入,如text,url或search元素,开发人员可以为用户提供一张实用的推荐单,浏览器可以根据用户的历史输入来提供这个表单(这由前面提到的autocomplete属性来控制).但有时,浏览器可能需要向用户推荐一些预定义的术语.实现这些建议选项需要使用datalist元素.
   datalist元素包含一个推荐表单,每一条建议都包含在一个option子元素中,下面一个含有少数建议选项的datalist:
   <datalist id="apes">
    <option>Chimpanzee</option>
    <option>Gorilla,Eastern</option>
    <option>Gorilla,Western</option>
    <option>Grangutan</option>
   </datalist>
   datalist元素并不在页面上使用,另外,它也无需对引用它的输入关闭;这元素可以置于标记的任何位置.
   要想创建用户输入数据的输入栏与含有推荐选项的datalist元素之间的关联,那么前者需使用后者的id值作为其list属性的值:
   <input type="text" list="apes">
   现在,当用户一个字母时,datalist中任何匹配这个序列的option元素的值都将显示在输入下方的推荐表彰中,在这个表彰中,用户可以选择一个匹配选项,读者可以在input-types-more.html文件中看到相应的显示结果.