尝试使用typeahead.js
substringMatcher函数
.on()，，
input事件的最小修改版本
var substringMatcher = function(strs, q, cb) { return (function(q, cb, name) { var matches, substrRegex; // an array that will be populated with substring matches matches = []; // regex used to determine if a string contains the substring `q` substrRegex = new RegExp(q, 'i'); // iterate through the pool of strings and for any string that // contains the substring `q`, add it to the `matches` array $.each(strs, function(i, str) { if (substrRegex.test(str)) { // the typeahead jQuery plugin expects suggestions to a // Javascript object, refer to typeahead docs for more info matches.push(name(str)); } }); cb(matches); }(q, cb, function(res) { return res }));};$("#typeahead").on("input", function(e) { $.ajax({ url: "https://gist.githubusercontent.com/guest271314/"+ "ffac94353ab16f42160e/raw/"+ "aaee70a3e351f6c7bc00178eabb5970a02df87e9/states.json", processdata:false, data: JSON.stringify({ "search": "people", "query": e.target.value }) }) .then(function(json) { if (e.target.value.length) { substringMatcher(JSON.parse(json), e.target.value, function(results) { $("#results ul").empty(); $.map(results, function(value, index) { $("#results ul") .append($("<li />", { "class": "results-" + index, "html": value })) }) }) } else { $("#results ul").empty(); } }, function err(jqxhr, textStatus, errorThrown) { console.log(textStatus, errorThrown) })});<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script><input type="text" id="typeahead" placeholder="search" /><br /><div id="results"> <ul> </ul></div>
