Question

我正在尝试使用jQuery-UI提供的自动完成小部件。这是我的代码，但似乎没有用。

我的标题中有以下内容：

<script src="http://code.jquery.com/ui/1.10.4/jquery-ui.min.js"></script>
<script src="/js/auto-complete.js"></script>

然后我的表格带有文字输入：

<input type="text" id="keyword" placeholder="Start typing to search..." name="keyword"/>

auto-complete.js文件：

$(document).ready(function() {
    $('#keyword').autocomplete({
        source: 'suggest_name.php',
        minLength: 2
    });
});

suggest_name.php文件：

echo "suggest name";
die();

什么都没发生。有什么建议？

注意：只是尝试为它提供一个充满静态信息的数组并且它正在工作，但我不知道它为什么不检测我的PHP脚本作为数据源。

Answer 1

以下是不够的：

echo "suggest name";

阅读jQuery UI autocomplete's source parameter的文档，其中的部分是：

数组：数组可用于本地数据。有两个支持   格式：


字符串数组：[ "Choice1", "Choice2" ]

具有标签和值属性的对象数组：[ { label: "Choice1", value: "value1" }, ... ]


标签属性显示在建议菜单中。价值会   当用户选择项目时插入到input元素中。如果   只指定了一个属性，它将用于两者，例如，如果你   只提供值属性，该值也将用作   标签

[...]

字符串：使用字符串时，自动完成插件需要这样做   string指向将返回JSON数据的URL资源。 [...]   数据本身可以   格式与上述本地数据相同。

长话短说，至少你必须输出如下内容：

header("Content-type: application/json");
echo json_encode(array("suggest name"));

输出：

["suggest name"]

Answer 2

您的PHP程序需要一个绝对 URL，该程序会在参数 source 中生成自动填充数据。

如果发送xhr请求并收到正确的HTTP响应，请查看浏览器开发人员工具。

Answer 3

首先检查您的请求是否实际发生，检查自动填充是否与您的输入绑定。

一旦您明确表明该请求实际发生了：

您只返回一个字符串，而 the documentation 表示您需要返回一个字符串数组["string","string2"]或一个带有标签和值的对象数组：{ {1}}

文档存在是有原因的，它有完美的例子说明一切如何运作。

源文件的Jquery自动完成问题

3 个答案: