【问题标题】:Restrict Google Places API to specific country将 Google Places API 限制在特定国家/地区
【发布时间】:2016-06-22 23:58:07
【问题描述】:

我正在尝试将自动完成功能限制在特定国家/地区,即美国。我怎样才能做到这一点?通过将变量选项作为参数传递给初始化函数,我尝试了以下操作:

   <script>
    var autocomplete = {};
    var autocompletesWraps = ['test', 'test2'];

    var test_form = { street_number: 'short_name', route: 'long_name', locality: 'long_name', administrative_area_level_1: 'short_name', country: 'long_name', postal_code: 'short_name' };
    var test2_form = { street_number: 'short_name', route: 'long_name', locality: 'long_name', administrative_area_level_1: 'short_name', country: 'long_name', postal_code: 'short_name' };

    function initialize() {

        var options = {
            types: ['(cities)'],
            componentRestrictions: {country: "us"}
        };

        $.each(autocompletesWraps, function(index, name) {

            if($('#'+name).length == 0) {
                return;
            }

            autocomplete[name] = new google.maps.places.Autocomplete($('#'+name+' .autocomplete')[0], { types: ['geocode'] }, options);

            google.maps.event.addListener(autocomplete[name], 'place_changed', function() {

                var place = autocomplete[name].getPlace();
                var form = eval(name+'_form');

                for (var component in form) {
                    $('#'+name+' .'+component).val('');
                    $('#'+name+' .'+component).attr('disabled', false);
                }

                for (var i = 0; i < place.address_components.length; i++) {
                    var addressType = place.address_components[i].types[0];
                    if (typeof form[addressType] !== 'undefined') {
                        var val = place.address_components[i][form[addressType]];
                        $('#'+name+' .'+addressType).val(val);
                    }
                }
            });
        });
    }
</script>

【问题讨论】:

    标签: javascript jquery autocomplete google-places-api


    【解决方案1】:

    您没有正确传递options。 Autocomplete 接受两个参数,而你传递了三个。

    具体来说,在这一行:

    autocomplete[name] = new google.maps.places.Autocomplete(
        $('#'+name+' .autocomplete')[0], { types: ['geocode'] }, options);
    

    您的options 参数未使用,因为您已将{ types: ['geocode'] } 作为选项传递。

    所以去掉多余的参数:

    var options = {
        types: ['geocode'],  // or '(cities)' if that's what you want?
        componentRestrictions: {country: "us"}
    };
    autocomplete[name] = new google.maps.places.Autocomplete(
        $('#'+name+' .autocomplete')[0], options);
    

    【讨论】:

    • 谢谢。没有意识到它只接受了两个,但考虑到我的最后两个基本上彼此相等,这是有道理的。
    【解决方案2】:

    如果您只想将 Google Address API 与 英国 地址集成。请找到以下地址:

    <script  type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=API_KEY&libraries=places" async defer></script>
    
    <script type="text/javascript>
    var autocomplete;
    function initialize() {
      autocomplete = new google.maps.places.Autocomplete(
          (document.getElementById('txtpostcode')),
          { types: ['geocode'] });
      autocomplete.setComponentRestrictions(
                {'country': ['uk']});
      google.maps.event.addListener(autocomplete, 'place_changed', function() {
      });
    }
    </script>
    

    【讨论】:

    • 您的脚本类型末尾缺少双引号
    猜你喜欢
    • 2017-08-05
    • 2017-08-28
    • 2016-04-02
    • 2020-11-08
    • 1970-01-01
    • 2015-09-03
    • 2016-01-25
    • 2012-07-23
    • 1970-01-01
    相关资源
    最近更新 更多