Javascript 将google地图自动完成与jquery自动完成集成

我想将我的jQuery自动完成字段与google地图集成。因此，该字段将显示预定义数组的结果，同时解析为GoogleMaps

我的代码：

var autocompleteService = new google.maps.places.AutocompleteService();
var autocompleteList = [];
var eventsList = ["event1","event2"];

$("#edtSearch").autocomplete({
        source: eventsList
}).on("autocompleteopen",function(event){
        autocompleteList = eventsList.slice(0);

        autocompleteService.getQueryPredictions({input: $(this).val()},
        function(predictions, status){
            if (status != google.maps.places.PlacesServiceStatus.OK) {
                console.log(status);
                return;
            }

            for (var k = 0, prediction; prediction = predictions[k]; ++k)
            {
                prediction = String(prediction.description).replace(/,/g,"");
                autocompleteList.push(prediction);
            }

            $("#edtSearch").autocomplete({
                source: autocompleteList
            });
            $("#edtSearch").autocomplete("search");
            console.log(autocompleteList);
        });
});

html:

和类似的解决方案，但我得到的错误是“未捕获错误：缺少参数。您必须指定输入”。

---

如何解决此问题？

在您的案例中，

getQueryPredictions

调用中的

input

参数为未定义、null或空字符串

要解决此问题，您需要检查

input

（

$（本例中为.val（）

）的值是否包含一些字符

<input id="edtSearch" type="text" size="50" />

var edtSearch = document.getElementById("edtSearch");
edtSearch.addEventListener("keypress",function(){});