// 获得焦点是重新进行查询 $("#xxx").focus(function () { $("#xxx").autocomplete("search"); }); // 检索信息(模糊匹配) $("#xxx").autocomplete({ scrollHeight:180, scroll:true, delay: 500,//延迟500ms便于输入 source: function (request, response) { $.ajax({ url: '${ctx}/xx/xxxx', type: "post", dataType: "json", data: {"xxx": $("#xxx").val()}, success: function (data) { var obj = $.parseJSON(data.data); var dataArr = obj.data; response($.map(dataArr, function (item) { return { result: item, label: item.name, value: item.code } })); } }); }, select: function (event, ui) { $("#xx").val(ui.item.label); $("#xx").val(ui.item.value); $("#xxxx").val(ui.item.result.id); $("#xx").val(JSON.stringify(ui.item.result)); return false; } });
2.设置下拉框(加入下面css代码即可)
.ui-autocomplete { max-height: 300px; overflow-y: auto; overflow-x: hidden; } html .ui-autocomplete { height: 300px; }
3.引入相应文件
引入附件内容