鼠标悬停并Mouseout 与输入字段的 jQuery 问题

Question

旧代码

当我越过“#search”div然后它像我应该做的那样滑动它时遇到了问题，但问题是当它滑出时它会显示一个搜索输入字段，当鼠标滑出时它会显示一个搜索输入字段越过该输入字段，它开始运行鼠标移出功能，我通过将鼠标悬停在带有空函数的 #search 输入上来停止此操作，但是当我的鼠标离开输入和“#search”潜水时，它不会运行动画返回功能。

这是我的脚本

$("#search").mouseover(function(){
    $(this).animate({"left": "0px"}, 500);
});
$("#search").mouseout(function(){
    if($("#search input").mouseover()){
        return false
        }
    else {
    $(this).animate({"left": "-282px"}, 500);
    }
});

我做错了什么？或者有人有解决办法吗？我是 jQuery 的新手，所以刚刚开始学习:)，我在过去 2 天搜索了 Google 和文档，也许只有我是盲目的，这就是为什么我需要你的帮助：

编辑：新代码 & JS FIDDLE

我需要对搜索栏进行不同的操作，所以我只是再次编写了代码，现在需要单击该语句。看这里 JSfiddle

http://jsfiddle.net/D7s45/2/

这就是我想要的 jQuery创造 ：）

Answer 1

var t, isout=true;
$("#search").children("form").children().mouseover(function () {
    clearTimeout(t); isout = false;
});

$("#search").children("form").children().mouseout(function () {
    isout = true;
    tout = setTimeout(function () { $("#search").animate({ "left": "-282px" }, 500); }, 100);

});

$("#search").mouseover(function () {
    if (isout) $(this).animate({ "left": "0px" }, 500);
    clearTimeout(t); isout = false;
});

$("#search").mouseout(function () {
    isout = true; tout = setTimeout(function () { $("#search").animate({ "left": "-282px" }, 500); }, 100);
});

Answer 2

尝试在将鼠标悬停在输入上时停止传播：

$("#search input").hover(function(e) {
  e.stopPropagation();
}, function(e) {
  e.stopPropagation();
});

#search div 的常规代码应该可以正常运行。