Javascript 如何覆盖jquery ui自动完成项?

Javascript 如何覆盖jquery ui自动完成项?,javascript,jquery,jquery-ui,autocomplete,Javascript,Jquery,Jquery Ui,Autocomplete,我正在使用jquery autocomplete将城市从GeoNames加载到我页面上的文本框: $("#MyInput").autocomplete({ source: function (request, response) { $.ajax({ url: "http://ws.geonames.org/searchJSON", dataType: "jsonp", data: { featureClass: "

我正在使用jquery autocomplete将城市从GeoNames加载到我页面上的文本框:

$("#MyInput").autocomplete({
source: function (request, response) {
    $.ajax({
        url: "http://ws.geonames.org/searchJSON",
        dataType: "jsonp",
        data: {
            featureClass: "P",
            style: "full",
            maxRows: 10,
            name_startsWith: request.term
        },
        success: function (data) {
            response($.map(data.geonames, function (item) {
                return {
                    label: item.name + ", " + item.countryName,
                    value: item.name + " (" + item.countryName + ")" + " [" + item.countryCode + "]"
                };
            }));
        }
    });
}
}).data("autocomplete")._renderItem = function (ul, item) {
    return $("<li></li>")
        .data("item.autocomplete", item)
        .append("<a><strong>" + item.label + "</strong> / " + item.value + "</a>")
        .appendTo(ul);
};
$(“#MyInput”).autocomplete({
来源:功能(请求、响应){
$.ajax({
url:“http://ws.geonames.org/searchJSON",
数据类型:“jsonp”,
数据:{
特色类:“P”,
样式:“完整”,
马克斯罗:10,
name_startsWith:request.term
},
成功:功能(数据){
响应($.map(data.geonames,函数(项)){
返回{
标签:item.name+,“+item.countryName,
值:item.name+“(“+item.countryName+”)+“[“+item.countryCode+”]”
};
}));
}
});
}
}).数据(“自动完成”)。\u renderItem=功能(ul,项目){
返回$(“
  • ”) .data(“item.autocomplete”,item)
    .append(“

    我只是在我想设置文本框的“数据”的地方这样做。在我的例子中,我不想显示任何“数据”。我只是在执行称为数据的映射时“添加”了第三个值,并将其设置为“项”,然后给出了一个“选择”部分。请参见下文

        $(document).ready(function () {
            var $birds = $("#birds")
            $birds.focus();
            mURL = "my url here";
            $birds.autocomplete({
                minLength: 0,
                source: function (request, response) {
                    $.ajax({
                        type: "POST",
                        url: GW.Common.getBaseURL() + "/Functions/EmailCounts/TypeAHead.aspx/country_state_city",
                        data: "{'text':'" + request.term + "'}",
                        contentType: "application/json; charset=utf-8",
                        dataType: "json",
                        success: function (msg) {
                            var jsonData = $.parseJSON(msg.d)[0].Cities;
                            response($.map(jsonData, function (item) {
                                return {
                                    label: item.name + ', ' + item.state + ' ' + item.country,
                                    value: item.name + ', ' + item.state + ' ' + item.country,
                                    data: item // added as "extra"
                                };
                            }));
                        },
                        error: function (msg) {
                            alert(msg.status + ' ' + msg.statusText);
                        }
                    })
                },
                focus: function (event, ui) {
                    $birds.val(ui.item.label);
                    return false;
                },
                select: function (event, ui) {
                    log(ui.item ? "Selected: " + ui.item.value + " aka " + ui.item.id : "Nothing selected, input was " + this.value);
                    $birds.val(ui.item.label);
                    $birds.attr("data", JSON.stringify(ui.item.data)); // now you can use the extra "data" you set in success.
                    return false;
                }
            });
    

    演示似乎工作正常,正在创建正确的html。有什么问题吗?