Question

jQuery：

$("[type=text]").autocomplete({
source: "json.php",
minLength: 0
}).addClass("ui-widget ui-widget-content ui-corner-left");

如果我将源代码更改为JS数组，则可以正常工作。我知道php正在运行，因为我可以在控制台中看到它，但这里是示例php反正：

$arr = array ('a'=>1,'b'=>2,'c'=>3,'d'=>4,'e'=>5);
echo json_encode($arr);

所以下拉列表没有显示。现在感觉非常愚蠢。

Answer 1

在你的json.php文件中，一定要在echo之前通过header（）函数将内容编码设置为json。这样jQuery应该将数组视为正确的json。

header("Content-Type: application/json");
$arr = array ('a'=>1,'b'=>2,'c'=>3,'d'=>4,'e'=>5);
echo json_encode($arr);

Answer 2

http://jqueryui.com/demos/autocomplete/remote-jsonp.html

从演示网站上查看此内容。

$( "#city" ).autocomplete({
            source: function( request, response ) {
                $.ajax({
                    url: "http://ws.geonames.org/searchJSON",
                    dataType: "jsonp",
                    data: {
                        featureClass: "P",
                        style: "full",
                        maxRows: 12,
                        name_startsWith: request.term
                    },
                    success: function( data ) {
                        response( $.map( data.geonames, function( item ) {
                            return {
                                label: item.name + (item.adminName1 ? ", " + item.adminName1 : "") + ", " + item.countryName,
                                value: item.name
                            }
                        }));
                    }
                });
            },
            minLength: 2,
            select: function( event, ui ) {
                log( ui.item ?
                    "Selected: " + ui.item.label :
                    "Nothing selected, input was " + this.value);
            },
            open: function() {
                $( this ).removeClass( "ui-corner-all" ).addClass( "ui-corner-top" );
            },
            close: function() {
                $( this ).removeClass( "ui-corner-top" ).addClass( "ui-corner-all" );
            }
        });

Answer 3

几天前，我在使用JSON填充的自动填充功能时遇到了问题。

我的问题是我没有设置内容类型，正如Wally在上面所说：

header("Content-Type: application/json");

我还将jQuery自动完成调用包含在getJSON中，然后使用该函数中的数据填充自动完成字段。我的直觉告诉我，额外的getJSON不应该是必要的，但是和你一样，我在引用我的PHP文件作为源时遇到了问题。

$.getJSON("json.php", function(data) {
    $("[type=text]").autocomplete({
        dataType: "json",
        source: data,
        minLength: 1,
    }); 
});

由于我使用的是旧的PHP版本，因此我手工制作了我的JSON。我包含了“标签”和“价值”字段，因为我非常确定它们是自动完成工作所必需的。

$jsonList = "[{"label" : "Item 1", "value" : "1"}, {"label" : "Item 2", "value" : "2"}]";
return $jsonList;

jQuery UI自动完成不会显示返回的json（PHP）

3 个答案: