又是一周，以前总说码农码农现在才理解为什么这个职业刚开始就是搬砖的了
废话就到此为止
今天给大家说一下如何利用HTML5特性写一个既可以输入又可以选择的输入框
其实在HTML5中，有这样一个属性的Input框 叫做 Datalist
顾名思义就是利用已有的Data为用户提供选择项
具体代码如下
<input list="companys"/>
<datalist id="companys">
<option value="Apple">
<option value="Microsoft">
<option value="Github">
</datalist>
PS:这里的list一定要跟Datalist id 一致哦
这段代码实现了下列效果如图：
还可以实现自动补全功能哦.
作者用这种方法替代了JQuery的Autocomplete功能但是不建议这么做因为机制不同
php渲染页面需要很长时间 对于大数据量的还是建议autocomplete哈，如果有更好的方法
欢迎留言
对于后端来说这里笔者以PHP 举例
image
只遍历数据 逐一赋值给<option value>即可
但还是那句话：少量数据建议这么做
网友评论