带有json问题的jQuery自动完成ui答案

【问题标题】：jQuery autocomplete ui with json issue带有json问题的jQuery自动完成ui
【发布时间】：2017-04-29 11:48:13
【问题描述】：

我正在尝试让 jquery 自动完成 ui 工作，但没有成功。没有显示匹配列表。我收到错误“TypeError：this.source is not a function”

到目前为止，我有一个输入字段<input type="text" id="searchbar" name="title" placeholder="Search">

然后在我的脚本中我有

我没有让这个工作。有人知道我可以从哪里开始排除故障吗？我真的很难使用 jquery ui 文档。

【问题讨论】：

【解决方案1】：

您只需使用此代码进行自动完成：

$("#searchbar").autocomplete({
    source: "php/searchbar.php",
    minLength: 3
});

您不必执行额外的 ajax 请求。它自己的插件执行 ajax 请求。

您的自动完成选择器中也缺少哈希：
$("searchbar") 与 $("#searchbar")

我在这里创建了一个 jsfiddle：https://jsfiddle.net/9rtu412g/

来自此处的文档来源： https://jqueryui.com/autocomplete/#remote（查看源代码）

对于您的 jQuery 版本：
<script src="js/jquery-1.6.js" type="text/javascript"></script>

我希望我能帮助你解决你的问题。

【讨论】：

有了这个，在我的 html 而不是单独的 JS 文件中，我收到错误“TypeError: $(...).on is not a function”跨度>
TypeError: $(...).on 不是函数 - 跨度>
@Polarbearz 已更新。我希望您使用 jQuery UI 1.11.4（旧版，用于 jQuery1.6+）或更低版本进行自动完成？
使用您提供的代码现在可以正常工作，并显示如下结果：puu.sh/vzYwk/806628ecd5.png。非常感谢您的帮助，我现在只需要以某种更好的方式显示结果。出于某种原因，我也无法点击结果并链接到页面/事件。
@Polarbearz 您是否已将 jQuery UI 包中的 CSS 文件添加到您的页面？像这样：cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.4/…

【解决方案2】：

首先 console.log 你的数据检查是否有任何从 ajax 请求返回的数据，然后从你的数据变量中删除双引号。

 source: "data"(wrong)
 source: data(right)

希望对你有帮助

【讨论】：

我改变了这个，现在我得到了错误：TypeError: this.source is not a function - 根据这个线程，stackoverflow.com/questions/3308935/…，数据需要放在一个变量中，并且我已经更新了上面的 JS，但仍然出现错误。