JSFiddle - React, Tailwind, and code Playground
HTML
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/themes/smoothness/jquery-ui.css">
<ul><li>Put your mouse below the query box and type the letter "a".</li>
<li>Autocomplete will select an item even though you didn't really select anything with your mouse.</li>
<li>When you hit enter, autosuggest will handle the enter as your selection, and then the keypress event is called.</li></ul>
<p>Query: <input id="query" size="30"></p>
CSS
p {margin:1em;}
ul li {margin:1em;}
JavaScript
$('#query').autocomplete({
source: [
"A",
"AAA",
"AAAAA",
"AAAAAAAAA",
"AAAAAAAAA",
"AAAAAAAAAAA",
"AAAAAAAAAAAAAA",
"AAAAAAAAAAAAAAAA",
"AAAAAAAAAAAAAAAAAA",
"AAAAAAAAAAAAAAAAAAAAA",
"AAAAAAAAAAAAAAAAAAAAAAAA"
],
focus: function(e, ui) {
$("#location").val(ui.item.label);
return false;
}
});