У меня есть поле ввода, где я пытаюсь сделать предложение автозаполнения. Код выглядит так
<input type="text" id="myinput">
<div id="myresults"></div>
На входном blur()
событии я хочу скрыть результаты div:
$("#myinput").live('blur',function(){
$("#myresults").hide();
});
Когда я что-то записываю в свой ввод, я отправляю запрос на сервер и получаю ответ json, разбираю его в структуре ul-> li и помещаю этот ul в мой #myresults
div.
Когда я нажимаю на этот разобранный элемент li, я хочу установить значение от li до input и скрыть #myresults
div
$("#myresults ul li").live('click',function(){
$("#myinput").val($(this).html());
$("#myresults").hide();
});
Все идет хорошо, но когда я нажимаю на blur()
событие li, которое запускается раньше, click()
и значение input не получает html li.
Как я могу настроить click()
событие раньше blur()
?
blur
он действительно запускается после того, как вы нажали наli
, то вам, вероятно, не нужно выполнять$("#myresults").hide()
обработчик щелчка. Кажется, что происходит то, что$(this).html()
возвращается пустая строка. Не могли бы выlog
илиalert
$(this).html()
убедиться?blur()
и handlersclick()
, послеblur()
конца никаких действий нетОтветы:
Решение 1
Слушать
mousedown
вместоclick
.События
mousedown
иblur
происходят один за другим при нажатии кнопки мыши, ноclick
происходят только после отпускания.Решение 2
Вы можете
preventDefault()
вmousedown
блокировать ниспадающее меню от кражи фокуса. Небольшое преимущество заключается в том, что значение будет выбрано, когда кнопка мыши отпущена, именно так работают нативные компоненты выбора.JSFiddleисточник
FIDDLE
источник
Я столкнулся с этой проблемой, и использование
mousedown
не вариант для меня.Я решил это с помощью
setTimeout
функции обработчикаисточник
Я только что ответил на аналогичный вопрос: https://stackoverflow.com/a/46676463/227578
Альтернативой решениям mousedown является игнорирование событий размытия, вызванных щелчком по конкретным элементам (т. Е. В обработчике размытия пропустите выполнение, если оно является результатом щелчка по определенному элементу).
источник
Mousedown solutions не работает для меня, когда я нажимаю на не кнопочные элементы. Итак, вот что я сделал с функцией размытия в моем коде:
источник