当搜索字段失去焦点时使搜索菜单消失，但仍允许用户单击链接答案

【问题标题】：Make a search menu disappear when the search field loses focus, but still allow user to click on links当搜索字段失去焦点时使搜索菜单消失，但仍允许用户单击链接
【发布时间】：2011-07-09 00:52:19
【问题描述】：

On my website我有一个搜索框（文本输入框）。当用户点击它并开始输入文本时，会出现一个链接菜单。菜单通过 JQuery 出现 - 以下命令使菜单出现：

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

当用户点击搜索框时，我希望菜单消失。

最简单的方法是使用以下命令：

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

但是，如果我这样做，那么当用户单击菜单中的链接时，文本输入字段会失去焦点，因此菜单会在用户被带到选择页面之前消失。我怎样才能使它在搜索字段失去焦点时菜单消失，（但如果用户在搜索字段失去焦点之前点击链接，她/他仍然能够被带到该链接）？

【问题讨论】：

我也有同样的问题，希望您能尽快得到答案。 =)

标签： javascript jquery hide onblur

【解决方案1】：

需要将点击绑定到body才能隐藏

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

});

请参阅http://jsfiddle.net/WYbp3/4/ 的工作示例

【讨论】：

那个答案已经 6 年了，它仍然是唯一的解决方案吗？

【解决方案2】：

你能说得更具体点吗，我不明白这个问题。我检查了您的网站，当我开始输入内容时，会显示一个带有结果的模态框样式菜单。然后，如果我模糊输入框仍然存在。

【讨论】：