一：自动补全输入框
我们可以定义一种具有自动补全功能的输入框，预先设定一些可选值作为自动补全内容。当用户输入可选值的部分内容时，就会在下面自动列出匹配的选项，点击即可自动填充对应的选项。
二：定义自动补全输入框
<div class="item-input-wrap"> <input id="autocomplete-dropdown" type="text" placeholder="提示文本"> </div>
三：在js中创建候补选项，并且为输入框创建自动补全控件
var array =[‘选项1‘,‘选项2‘,...] //创建候补选项 //创建自动补全 var autocompleteDropdownSimple = app.autocomplete.create({ inputEl: ‘#autocomplete-dropdown‘,//自动补全输入框id openIn: ‘dropdown‘, source: function (query, render) {//query是输入框接收到的检索关键字，render是渲染器 var results = [];//候补结果 if (query.length === 0) { render(results); return; } // 1:根据检索关键字查找匹配的候补结果 for (var i = 0; i < array.length; i++) { if (array[i].toLowerCase().indexOf(query.toLowerCase()) >= 0) results.push(array[i]); } // 2:把匹配结果渲染到输入框下方供选择 render(results); } });
四：各种自动补全输入框效果案例
http://framework7.io/docs/autocomplete.html
