Question

当我查看Chrome开发者工具的回复时，我看到了这一点：

[{
"summary": "foo",
"key": "myKey"
}]

我的javascript（更新）：

jquery183(function() { 
jquery183( "#city" ).autocomplete({
    source: function( request, response ) {
        jquery183.ajax({
            url: '/servlet/ajax/',
            dataType: "jsonp",
            data: {
                featureClass: "P",
                style: "full",
                maxRows: 12,
                name_startsWith: request.term
            },
            success: function( data ) {
                response( jquery183.map( data, function( issue ) {
                    return {
                        label: issue.summary + ", " + issue.key,
                        value: issue.summary
                    }
                }));
            }
        });
    },
    minLength: 2,
    open: function() {
        jquery183( this ).removeClass( "ui-corner-all" ).addClass( "ui-corner-top" );
    },
    close: function() {
        jquery183( this ).removeClass( "ui-corner-top" ).addClass( "ui-corner-all" );
    }
});

}）;

HTML：

 <div class="ui-widget">
    <label for="city">Your city: </label>
    <input id="city" />
    Powered by <a href="http://geonames.org">geonames.org</a>
 </div>

我认为这应该可行，但它不会建议任何自动填充项目。有什么建议？

如果需要更多代码，请随时提问。

Answer 1

如上所示：http://jqueryui.com/autocomplete/#remote-jsonp

您忘记复制/粘贴ajax调用以检索您的数据。

$( "#city" ).autocomplete({
      source: function( request, response ) {
        $.ajax({
          url: "http://ws.geonames.org/searchJSON",
          dataType: "jsonp",
          success: function( data ) {
            response( $.map( data.geonames, function( item ) {
              return {
                label: item.name + (item.adminName1 ? ", " + item.adminName1 : "") + ", " + item.countryName,
                value: item.name
              }
            }));
          }
        });
      }
});

Answer 2

我不确定<input id="city" />是否存在问题。应该是<input id="city" type="text"/>

Answer 3

从这里找到答案：

Ajax success event not working

结果可能不是JSON格式，所以当jQuery尝试解析它时，它会失败。您可以通过错误捕获错误：回调函数。

无论如何你似乎不需要JSON，所以你也可以   取出dataType：'json'行。

jQuery UI不能从JSON自动完成

3 个答案: