JavaScript ui-autocomplete не реагируется на focus()
У меня есть проблема с использованием focus() (чтобы поставить фокус в поле поиска после нажатия на кнопку) на элементе, который имеет ui-autocomplete.
<input id="headerSearch" class="header-search-form-input form-control ui-autocomplete-input" name="query" type="text" value="" autocomplete="off">
и когда я использую $('#headerSearch').focus() чтобы поместить курсор в это поле - это не срабатывает.
Я нашел что это может быть потому что поле уже имеет это событие. Я проверил это через Google Chrome EventListener и да, это поле имеет event.focus().
И я теперь не понимаю как я могу поместить курсор после действия в это поле, если оно уже занято этим событием?
Спасибо за помощь.
UPD Я нашел как удалить событие, но это все равно не сработало. Фокус в поле не ставится, чтобы сразу можно было писать. Хотя когда делаю это в Консоли - все ок.
$('#headerSearch').off('focus');
$('#headerSearch').focus();
Ответы (1 шт):
При нажатии на кнопку появлялся слой в котором был input, видимо (я предполагаю), что сам input не успевал "появиться" для браузера и он не мог получить фокус там, я сделал так (не знаю костыль это или нет, но сработало).
setTimeout(function() { $('#headerSearch').focus(); }, 100);
Дальше поэксперементировав я увидел, что не обязательно удалять событие focus у элемента $('#headerSearch').off('focus');, но мне непонятно почему? Если кто-то знает ответ - буду благодарен.
Предполагаю, что это не событие, а метод, поэтому смысл удалять событие, если я его не занимаю.
Меня ввело в заблуждение то, что везде пишут в ответах, что если не ставится фокус в поле - посмотрите не занято ли событие и удалите его тогда.