Question

我正在使用Google Maps Places Autocomplete api。

我希望在显示自动完成下拉列表之前在搜索过程中显示Ajax微调器。

如何确定地点结果何时准备就绪？是否有一些事件被解雇了？

这对于糟糕的互联网连接特别有用，因为延迟有时可能长达5秒。在疯狂地按Enter键进行搜索之前，用户需要知道搜索框是自动完成输入框。

Answer 1

您可以使用自动填充服务来获取查询预测。它有一个回调函数。

在您提供的链接示例中，您可以将 input 声明为脚本中的全局变量。并在初始化函数后使用自动完成服务访问它：

var input;
function initialize () {
  ...
  input = document.getElementById('pac-input');
  ...
}

function showSpinner() {
  document.getElementById('spinner').style.display = 'block';

  var service = new google.maps.places.AutocompleteService();
  service.getQueryPredictions({ input: input }, callback);
}

function callback(predictions, status) {
  if (status != google.maps.places.PlacesServiceStatus.OK) {
    document.getElementById('spinner').style.display = 'none';
    return;
  }
}

至于html文档中的更改：

  <body>
    <input id="pac-input" class="controls" type="text"
        placeholder="Enter a location" onkeypress="showSpinner()">
    <img id="spinner" src="spinner.gif" style="position:absolute; top:0; right:0; width: 250px; display: none">
  </body>

我只会在一秒钟超时（即如果用户的互联网连接速度很慢）时运行此项，否则微调器看起来像潜意识图像。

Google地图会放置自动填充加载事件

1 个答案: