1

我们正在开发一个旅行网络应用程序，这里有一些机场代码自动完成的场景，我正在努力让它按预期工作。我从 xml 获取所有机场代码和城市名称并将其绑定到文本输入。场景是当用户键入“ Mani ”时，它应该显示“所有城市都以 Mani 开头”，而不是显示包含该术语 mani 的所有城市（参见这张图片：http: //imgur.com/61WS6）。但是如果用户直接输入机场代码，它显然会显示结果。

所以为此，我使用那个猴子补丁来自动完成，现在它工作正常。但是现在，当用户输入像“JFK,LHR,MNL”这样的机场代码时，它没有给出任何结果。

这是所有旅游网站的工作方式，我需要您的帮助来实现这一目标。提前致谢。这是我的带有猴子补丁的自动完成代码。

$(document).ready(function() {
    var myArr = [];
    function parseXml(xml)
    {
        $(xml).find("CityAirport").each(function()
        {
            myArr.push($(this).attr("CityName")+"-"+$(this).attr("AirportCode"));
        }); 
    }

    function setupAC() {
        $("#from").autocomplete({
                source: myArr,
                minLength: 1,
                select: function(event, ui) {
                    $("#from").val(ui.item.value);
                }
        });
        $("#to").autocomplete({
                source: myArr,
                minLength: 1,
                select: function(event, ui) {
                    $("#to").val(ui.item.value);
                }
        });
    }

    $.ajax({
        type: "GET",
        url: "xmlFiles/flight/AirportCode.xml", 
        dataType: "html",
        success: parseXml,
        complete: setupAC,
        failure: function(data) {
            alert("XML File could not be found");
        }
    });
});
function hackAutocomplete(){    
    $.extend($.ui.autocomplete, {
        filter: function(array, term){
            var matcher = new RegExp("^" + term, "i");

            return $.grep(array, function(value){
                return matcher.test(value.value);// || value.value || value);
            });                     
        }
    });
}

此代码取自此线程：来自 SOF 的自动完成

4

1 回答 1

4

您必须拆分两个数据属性并使用回调函数作为源参数，或多或少像这样（见实际操作）：

var source = [
    { name: 'New york', code: 'JFK'},
    { name: 'Other name', code: 'BLA'},
    { name: 'Rome', code: 'FCO'}
];
$( "#autocomplete" ).autocomplete({
    source: function(request, response){
        var searchTerm = request.term.toLowerCase();
        var ret = [];
        $.each(source, function(i, airportItem){
            //Do your search here...
            if (airportItem.code.toLowerCase().indexOf(searchTerm) !== -1 || airportItem.name.toLowerCase().indexOf(searchTerm) === 0)
                ret.push(airportItem.name + ' - ' + airportItem.code);
        });

        response(ret);
    }
});​
于 2012-10-19T06:41:09.017 回答