У меня есть элемент списка данных html, для которого я пытаюсь показать список автозаполнения, только когда в поле введено более двух символов. на рабочем столе можно вводить символы от 0 до бесконечности, при этом ввод не теряет фокус, а список выглядит просто отлично. однако для мобильных устройств (в частности, - iOS safari), когда длина символа ввода достигает 3, курсор исчезает, несмотря на то, что ввод все еще имеет фокус. пользователь должен нажать на вход еще раз, чтобы продолжить поиск. Я упомяну, что браузер Safari предоставляет пользователю некоторые несвязанные результаты автозаполнения, пока эта длина не достигнет 3. вот слушатель в списке данных, который управляет моим предполагаемым поведением:
// Only show auto-complete results for greater than 2 characters.
searchNameInput.addEventListener('keyup', e => {
const input = e.target;
const list = input.getAttribute('data-list');
input.value.length > 2 ? input.setAttribute('list', list) : input.removeAttribute('list');
// Unrelated code (i think):
if (!input.value.length)
filtersProxy.searchName = { name: '', city: '', stateProvince: '' };
});
вот как выглядит браузер после ввода 3 символов. Обратите внимание, что поле ввода не имеет курсора. фактический список данных еще не появился.
Я пытался использовать setTimeout, чтобы вернуть фокус на элемент после каждого события keyup безрезультатно. этот поставил меня в тупик!