Question

请看这个： http://jsfiddle.net/Muj3d/8/

假设鼠标光标在div_1上，现在将鼠标从div_1拖到div_2，我们看到，第一次发生了mouseout行动mouseover之后。好的，现在从js代码中删除alerts()并再次重复鼠标拖动，如我们所见，div_2未删除，问题：为什么？

Answer 1

因为在mouseover div2事件中，您再次将其显示为block。 alert似乎引起了延迟。尝试将鼠标从div_1移动到文档中的其他位置，而不是将其移至div_2，看到div_2按预期消失。

Answer 2

因为这两个事件同时“几乎”发射。我说几乎意味着mouseover在mouseout之后开火，让div显示（display: block）。

如果您记录事件而非提醒，您将看到它们按顺序触发：http://jsfiddle.net/Muj3d/14/

希望能够解释它。

Answer 3

你的两个功能是隐藏然后显示div。如果没有暂停执行，警报会提供这么快，以至于你没有注意到它。

删除以下内容：

   $("#div_2").css({
       display: "block"
   });

你会明白我的意思。

Answer 4

你应该用这个：

$("#div_1").on("mouseout", function () {

      $("#div_2").css({
        'display': "none"
       });
     });


   $("#div_1").on("mouseover", function () {
      $("#div_2").css({
         'display': "block"
        });
   });

使用带有css显示属性的引号。

Answer 5

只需将第二个事件发件人从#div_2更改为#div_1：

$(document).ready(function () {

                $("#div_1").on("mouseout", function () {
                      //alert("action mouseout");
                    $("#div_2").css({display: "none"});
                 });


                  $("#div_1").on("mouseover", function () {
                       //alert("action mouseover");
                      $("#div_2").css({display: "block"});
                 });
            });

不懂工作的js代码

5 个答案: