Сделать так, чтобы меню поиска исчезло, когда поле поиска теряет фокус, но все же позволяет пользователю нажимать на ссылки

На моем сайте есть окно поиска (поле ввода текста). Когда пользователь нажимает на него и начинает набирать текст, появляется меню ссылок. Меню появляется через JQuery - следующая команда заставляет меню появиться:

".focus(function() {
    $("#instant_search_wrapper").show();
}); "

Когда пользователь нажимает на поле поиска, я бы хотел, чтобы меню исчезло.

Самый простой способ сделать это - использовать следующую команду:

".blur(function() {
    $("#instant_search_wrapper").hide();
});" 

Однако, если я это сделаю, то когда пользователь нажимает на ссылку в меню, поле ввода текста теряет фокус, и меню исчезает, прежде чем пользователь попадает на страницу выбора. Как сделать так, чтобы меню исчезало, когда поле поиска теряет фокус (но если пользователь нажимает на ссылку до того, как поле поиска теряет фокус, он / она все еще может быть перенаправлен на ссылку)?

2 ответа

Решение

Вам нужно привязать клик к телу для сокрытия

$(document).click(function() {
      $("#instant_search_wrapper").hide();

});

См. Рабочий пример на http://jsfiddle.net/WYbp3/4/

Можете ли вы быть более конкретным, я не понимаю вопроса. Я проверил ваш сайт, и когда я начинаю что-то печатать, отображается модальное меню стиля рамки с результатами. Тогда, если я размываю ввод, поле все еще там.

Другие вопросы по тегам