layui 文本自动填充
layui 插件地址:点我
js代码:
layui.config({ base: '../layui/autocomplete/' // 自己autocomplete文件路径 , version: false, debug: false, }); layui.use(['jquery', 'autocomplete'], function () { var $ = layui.jquery, autocomplete = layui.autocomplete; autocomplete.render({ elem: $('#end'), cache: true, url: '/static/data.json', response: {code: 'code', data: 'data'}, template_val: '{{d.name}}', template_txt: '{{d.name}} <span class=\'layui-badge layui-bg-gray\'>{{d.pinyin}}</span>', onselect: function (resp) { $('#content1').html("NEW RENDER: " + JSON.stringify(resp)); } }) });
html代码:
<input type="text" name="number" id="end" autocomplete="off" class="layui-input" placeholder="目的地">
data数据格式:
{ "code": 0, "data": [{ "id": "2", "consignee": "test", "phone_number": "18079775521", "address": "test" }, { "id": "3", "consignee": "zzzzzzzz1", "phone_number": "18079775321", "address": "test" }, { "id": "4", "consignee": "fffffffffffffff", "phone_number": "15078977897" }, { "id": "5", "consignee": "te", "phone_number": "18079175321", "address": "dsa" }, { "id": "6", "consignee": "zzzffff", "phone_number": "18079775511", "address": "dsadas" }], "msg": "" }