自动填充 - 点击时如何进行查询。当前显示列表中显示的所有选项

Question

我正在开发一个名为earthquake damage map的网站。它几乎完成了，但我的自动完成功能有问题。它与搜索按钮一起工作正常，但我想完全摆脱搜索按钮。它应该在我单击列表中的结果时查询结果，而是显示列表中显示的所有结果。

    <input type="text" id="search-string4" placeholder="Search by Earthquake" class="tb11" onclick="focus" oninput="doQuery()" onchange="doQuery()"> 

正如你所看到的那样，当我输入时查询结果是好的，但是当在列表中点击结果时，它不能正确显示。

非常感谢任何帮助。

Answer 1

无论您在单击搜索按钮时调用的是什么代码，都可以将该代码移动到自动完成的select事件中，如下所示：

$( "#search-string4" ).autocomplete({
   select: function(event, ui) {
        doQuery();
   }
});

来自jqueryui网站，

  从菜单中选择项目时，

选择事件被触发; ui.item指的是所选项目。 select的默认操作是将文本字段的值替换为所选项的值。取消此事件可防止更新值，但不会阻止菜单关闭