JSON 值在 jquery 自动完成中的格式不正确

Question

我的 jquery 自动完成脚本有问题。 这是我的代码：

返回

<?php
require_once("include/global.php");
require_once("include/con_open.php");
$q = "select name, id from tbl_hotel";
$query = mysql_query($q);
if (mysql_num_rows($query) > 0) {
    $return = array();
    while ($row = mysql_fetch_array($query)) {
    array_push($return,array('label'=>$row["name"],'id'=>$row["id"]));
    }
}
echo(json_encode($return));

正面

<input type="text" id="hotel" />

<link rel="stylesheet" type="text/css" href="http://cdn0.favehotels.com/v2/style/autocomplete/jquery.ui.all.css" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/jquery-ui.min.js"></script>

<script type="text/javascript">                     
$(document).ready(function() {
    $( "#hotel" ).autocomplete({
        position: { my : "right bottom", at: "right top" },
        source: "hotel-search.php",
        minLength: 2,
        select: function( event, ui ) {
            window.location.href=ui.item.id;
        }                   
    })._renderItem = function( ul, item ) {
        return $("<li></li>")
            .data("item.autocomplete", item)
            .append($("<a></a>").text(item.label))   
            .appendTo(ul);
    };
});
</script>

source: "hotel-search.php" 返回[{"label":"A", "id":"1"}]

当我将source: "hotel-search.php" 更改为source: [{"label":"A", "id":"1"}] 时

还不行。

但当我将其更改为 source: [{label:"A", id:"1"}] 时，它工作正常。

我应该怎么做才能使“hotel-search.php”的返回类似于{label:"Hotel A", id:"1"} 而不是{"label":"Hotel A", "id":"1"}

Answer 1

尝试$.getJSON 让 jQuery 获取 JSON 响应并将其解析为 JSON 对象：

$.getJSON('hotel-search.php', function(jsonData) {
   $("#hotel" ).autocomplete({
        position: { my : "right bottom", at: "right top" },
        source: jsonData,
        minLength: 2,
        select: function( event, ui ) {
            window.location.href=ui.item.id;
        }                   
    })._renderItem = function( ul, item ) {
        return $("<li></li>")
            .data("item.autocomplete", item)
            .append($("<a></a>").text(item.label))   
            .appendTo(ul);
    };
});

Answer 2

Naufal Abu Sudais：“它还不起作用”是指自动完成功能不断显示所有列表。它一直显示“A”，即使我输入了“B”

当您将autocomplete 与AJAX 调用一起使用时，会向服务发送一个GET 参数term：

hotel-search.php?term=WhatYouTypeInAutocomplete

所以如果你想要最短的列表，你必须在你的 PHP 文件中使用$_GET['term'] 来过滤响应项。