Как вызвать раскрытие результатов автозаполнения Google Адресов после первого использования? - PullRequest
0 голосов
/ 31 мая 2018

Используя Google Maps JavaScript API (через <script src="https://maps.googleapis.com/maps/api/js?key=MY_API_KEY&libraries=places&callback=initAutocomplete" async defer></script>), ввод моего адреса ...

enter image description here

... показывает информацию автозаполнения, когда я набираю "1251" ...

enter image description here

... и добавляет полный адрес для ввода, когда я нажимаюадрес (или нажмите ввод):

enter image description here

В настоящее время, если я нажимаю на ввод адреса снова (после того, как адрес был добавлен), он просто добавляет фокусна вход и ничего больше:

enter image description here

Мой вопрос: При нажатии на уже заполненный ввод, как я могу снова вызвать раскрывающийся список,использование данных ввода?

Однократное нажатие кнопки «Удалить» (простое изменение окончания с USA на US) снова открывает раскрывающийся список, но я не хочу, чтобы пользователь должен был изменятьзапись, чтобы увидеть раскрытие.Вот что я попробовал:

$('.geoloc input').on({

    // neither 'place_changed' nor 'focus' trigger the dropdown (doesn't work)
    click: function(){
        google.maps.event.trigger(this, 'place_changed');
        // or
        google.maps.event.trigger(this, 'focus', {});
    },

    // enter selects first address from dropdown (works)
    keydown: function(e){
        if (e.keyCode == 13) {
            google.maps.event.trigger(this, 'keydown', {keyCode:40});
            google.maps.event.trigger(this, 'keydown', {keyCode:13});
            this.blur();
        }
    }
});

Какой правильный метод для программного запуска триггера с использованием значения поля?

1 Ответ

0 голосов
/ 31 мая 2018

Мне кажется, я знаю, чего ты пытаешься достичь.Вы хотите, чтобы состояние текстового поля было сохранено, чтобы при восстановлении фокуса оно могло вернуться обратно туда, где вы были.Будет ли что-то подобное для вас?

var input = document.getElementById('searchTextField');
var autocomplete = new google.maps.places.Autocomplete(input);

input.addEventListener('input', function () {
  this.dataset.originalVal = this.value;
});
input.addEventListener('focus', function () {
  this.value = input.dataset.originalVal ? input.dataset.originalVal : this.value;
});
input {
  width: 300px;
}
<script src="https://maps.googleapis.com/maps/api/js?libraries=places"></script>
<input id="searchTextField" type="text">
...