带有搜索功能的下拉框

<div class="form-group country-opt-group">
    <input class="form-control input_value  " id="dataitem" list="DATALIST"/>
           <datalist id="DATALIST" class="country-opt">
                      <!-- <option ></option> -->
           </datalist>
    </input>
</div>

其实最主要的就是在option外面添加了一个可选的数据集datalist，datalist标签是H5新增的标签，可能存在很多浏览器兼容性问题。

通过id将input和datalist数据集关联起来，然后当input输入数据时，进行全局匹配，不区分大小写，匹配规则无法修改。

注意：此时的option和select里面的option有一定的属性含义差别，比如value属性！！！

还有input如果输入的内容不再datalist里面 也可以提交 这时候需要进行表单校验！！！