jquery高手快来看看（弹出层）

Question

需求是 我一个超链接  移上去要弹出一个层  同时我鼠标也可以移到我弹出的那个层里   问题就来了...这个弹出的层什么时候移除？  我的想法是设置1秒的时间 如果从那个超链接移出去而且没有移入到那个弹出层上面就把弹出层删除掉  我写了一段代码   但是不对  请高手指点下 ...谢谢
$(function(){
var x=10;
var y=30;
$("#test")
        .hover(
            function(e) {                
                $("body").append("<div id='tooltip' style='border:solid 1px #000; height:50px;width:50px'>测试</div>");
                $("#tooltip")
        .css({ "top": (e.pageY - x) + "px", "left": (e.pageX + y) + "px" })
        .fadeIn("fast");
            },
        function() {
            setTimeout(closed,1000);
        }
    )
        .mousemove(function(e) {
            $("#tooltip").css({ "top": (e.pageY - x) + "px", "left": (e.pageX + y) + "px" });
        }).mouseout(function(){
setTimeout(closed,1000);
});
});
function closed(){
$("#tooltip").remove();
}

Answer 1

用js写一个计时器，1秒后删除弹出层同时那个弹出层没有被触发
倒计时例子private DateTime dtExam = DateTime.Parse("2010-07-26 17:42:00"); //定义时间到期时间   
protected void timerCD_Tick(object sender, EventArgs e)  
  {  
  if (this.dtExam < DateTime.Now) //如果设置的时间已过
  {
  this.timerCD.Enabled = false; //将Timmer置为false
  labTimes.Text = "时间到！";
  }  
  else  
  {
  RefreshTime(); //刷新时间
  }  
  }    private void RefreshTime() //刷新时间的方法
  {  
  TimeSpan ts = this.dtExam - DateTime.Now; //时间差
  this.labDays.Text = ts.Days.ToString().PadLeft(2, '0') + "天";  
  this.labTimes.Text = ts.Hours.ToString().PadLeft(2, '0') + ":" + ts.Minutes.ToString().PadLeft(2, '0') + ":" + ts.Seconds.ToString().PadLeft(2, '0');  
  }前台代码：
<form id="form1" runat="server">
  <div>
  &nbsp;</div>
  &nbsp;<asp:TextBox ID="TextBox3" runat="server"></asp:TextBox>&nbsp;
  <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
  时<asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>分<asp:ScriptManager ID="ScriptManager1" runat="server">
  </asp:ScriptManager>
  <asp:UpdatePanel ID="UpdatePanel1" runat="server">
  <ContentTemplate>
  <asp:Timer ID="timerCD" runat="server" Interval="1000" OnTick="timerCD_Tick">
  </asp:Timer>
  <asp:Label ID="labDays" runat="server" Width="155px"></asp:Label><asp:Label ID="labTimes" runat="server" Width="155px"></asp:Label>
  </ContentTemplate>
  </asp:UpdatePanel>
  </form>

Answer 2

1.你现在不对的现象是什么？2.把HTML贴出来，便于检查问题。

Answer 3

从程序上粗看，你现在的情况如果照代码正常执行，可能是鼠标移出到弹出层上也会在一秒后关闭。你设了两处
.mouseout(function(){
            setTimeout(closed,1000);
        });
且不说设得对不对，如果对的话，这样就产生上面问题了。
你应该用变量接收setTimeout(closed,1000)的计时器句柄。在弹出层的.hover事件中让头一个函数加一句clearTimeOut(此句柄)，取消关闭事件。

Answer 4

   function closed(){ 
            $("#tooltip").remove();
    }
 弹一下看事件触发了没有

Answer 5

我的思路是这样的  但是功能没实现  我的问题就是  怎么判断我从超链接移出来是否移到弹出层上面    如果是移到了弹出层上面就组织那个setOuttime的执行

Answer 6

补充一下，应该在超链接和弹出层的鼠标进入事件里都clearTimeOut(计时器句柄)清除一下。有一个漏的恐怕都会有叠加导致错乱。

Answer 7

我设置的setTimeout 给一个变量 好像不起作用