Question

我正在尝试使一个大的搜索条div消失第二个我将鼠标从该div移开（但只有在使用另一个搜索栏上的.click函数可以看到大搜索栏之后）。

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

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

#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 link

您的代码有语法错误

<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 example放在一起，这样你就可以玩，或者如果我不按你的要求进一步指导我，我会尝试改进它。

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

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

Answer 3

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

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

3 个答案: