如何在另一个div上使用.click后使用.blur删除div

Question

我试图让一个大的搜索栏div消失第二个我从鼠标移开我的鼠标（但只有在大搜索栏从另一个搜索栏上使用.click功能可见）。

对不起，如果这听起来令人困惑，但这是我到目前为止所做的：

$("#bar-b").click(function() {
    $("#quickSearch").show();
});

#quickSearch #bar-b div是一个小的主搜索栏，一旦我点击它， #quickSearch div（我创建的大搜索栏）就会出现在小主搜索栏的正下方。 我想要做的是当我将光标移动到#quickSearch div时（我希望不会进行任何更改，所以没有任何事情发生，这是迄今为止所做的）但是当我从#quickSearch移动我的光标时div，我希望#quickSearch div消失。 如果有人能告诉我如何做到这一点，那么我将非常感谢。

我做了一些尝试，结果证明是不正确的，例如：

$("#bar-b").click(function() {
    $("#quickSearch").show();
});

$("#quickSearch").mouseleave(function() {
    $("#quickSearch").hide();
});

HTML标记（如果有帮助，在每个div下面列出）：

<div id="bar-b">
    <a name="thesearchbox"></a>
    <input id="Keyword" accesskey="4" type="text" name="keyword" value="Search   Jessops - Keyword, name, catalogue no." style="color: rgb(153, 153, 153); ">
    <input id="cmdSearch" class="button" type="submit" value="">
</div>

<div id="quickSearch" style="border: 3px solid black; height: 250px; display: none;">/div>

Answer 1

检查这个jsfiddle链接

你的代码有一个语法错误

<div id="quickSearch" style="border: 3px solid black; height: 250px; display: none </div>

div缺少一个结束标记..我已经纠正它并且它正常工作

<div id="quickSearch" style="border: 3px solid black; height: 250px; display: none;"> </div>​​​​​​​​​​​​

Answer 2

我认为这就是你所追求的，如果是这样，你真的不远了！ 我把一个jsFiddle示例放在一起，这样你就可以玩，或者如果我不按你的要求进一步指导我，我会尝试改进它。

$("#bar-b").bind("click", function() {
    $("#quickSearch").show();
});

$("#quickSearch").bind("mouseout", function() {
    $(this).hide();
});
​ 

Answer 3

如果我理解正确，看起来你正走在正确的道路上，你只需要确保你只能在正确的环境下躲藏。 实现这一目标的最简单方法可能是添加一个变量来存储状态，并在事件监听器函数中将其设置为true 。 在onClick处理程序中放置openedWithClick = true的行，可能还会根据您的场景添加对鼠标输入的检查。 您也可能希望使用mouseout()而不是mouseleave() 。 如果这不是您的问题，您可能需要澄清示例代码究竟发生了什么，以及它与您预期发生的情况有何不同。