Jquery Ui autocomplete只从一个国家获得城市

时间:2013-11-21 12:38:30

标签: javascript jquery html css jquery-ui

Please visit my fiddle 1st

我在那里使用jquery Ui自动完成,我希望只有一个国家(如孟加拉国)的下拉列表显示(触发)城市。我怎么能得到它?

以下是JavaScript方法:

$(function() {
    $( ".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
                        }
                    }));
                }
            });
        }
    });
});

感谢。

1 个答案:

答案 0 :(得分:3)

您需要在网址中传递国家/地区代码。例如`http://ws.geonames.org/searchJSON?&country=BD

Demo Fiddle

更新了js:

$(function() {
        $( ".city" ).autocomplete({
            source: function( request, response ) {
                $.ajax({
                    url: "http://ws.geonames.org/searchJSON?&country=BD",
                    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
                            }
                        }));
                    }
                });
            }
        });
    });