h5select动态加载数据_Html5新标签datalist实现输入框与后台数据库数据的动态匹配...

最近项目中涉及到一个小功能，客户在选择供应商时，由于供应商数目较多(大概3000个左右)，因此直接生成下拉框显然不现实，所以就更换解决方案，打算借助HTML5新增的标签datalist来实现输入中文/拼音首字母时，自动进入数据库模糊查询，并返回相应的结果，生成datalist，由于在输入框中的输入内容发生变化时，datalist会自动触发下拉框，所以使用起来比select更便捷。前端部分代码如下：

Html Code：

库存下拉框测试

下拉框测试

测试数据(默认均为d00001)：
昆山市大陆配件有限公司 ksdlpjyxgs

亿真企业有限公司 yzqyyxgs

泰州市安誊轴皮厂(集团厂) tzsatzpc(jtc)

按 供应商名动态匹配(中文或者拼音均可)：

JavaScript Code：

var listobj=null; //datalist对象

var requestItem=null; //后台返回的json数据中所需的key值

var inputContent=null; //input标签对象

/**search()说明：