将可点击的结果添加到 Google 地图自动完成功能答案

【问题标题】：Adding Clickable Results To Google Maps Autocomplete将可点击的结果添加到 Google 地图自动完成功能
【发布时间】：2016-09-29 18:49:42
【问题描述】：

我正在尝试将自定义结果添加到自动完成功能中并且运气不错，但我无法使结果可点击。左键或右键单击绝对没有任何作用。考虑以下代码：

<input type="text" name="query" id="query">
<script>
    var input = (document.getElementById('query'));
    var options = [];

    city = new google.maps.places.Autocomplete(input, options);

    google.maps.event.addListener(city, 'place_changed', function () {

        place = city.getPlace();


    });

    $("#query").on('input', function()
    {
        append_places($("#query").val());
    });

    var new_pac = false;
    function append_places(input)
    {
        if (!new_pac)
        {
            setTimeout(function()
            {
                $(".pac-container").append('<div id="new-pac""></div>');
            }, 1);

            new_pac = true;
        }
        else
        {
            $('#new-pac').empty();
        }

        $("#new-pac").append('<div class="pac-item areasearch"><a href="http://www.wherever.com">Foo</a><span class="pac-icon pac-icon-areas"></span><a class="pac-item-query" href="http://www.wherever.com">test</a></div>');

    }

</script>

新条目出现，看起来像一个链接，但点击时没有反应。关于如何实现这一点的任何想法？

【问题讨论】：

标签： javascript jquery google-maps-api-3 google-places-api

【解决方案1】：

看着Google Maps JS Demo，您似乎缺少在地图上定义首选视口以查看该地点的方法。您需要添加代码，无论它是否能够检索地点。

// If the place has a geometry, then present it on a map.
if (place.geometry.viewport) {
map.fitBounds(place.geometry.viewport);
}

这里是another example 供参考。

【讨论】：