Javascript 悬停jQuery`Added`元素时使其保持打开状态 已经回答了我自己看到答案了吗

因此，我们将继续前进

更多的背景： 当我们从DOM中已经存在的元素移动到jQuery的.append方法添加的元素时，我试图保持悬停

我用的是：悬停。这种方法在Chrome浏览器中运行良好，但在其他浏览器中没有。正如我们从上面的链接中发现的，它在不久前被删除了

旧：悬停法

---

所以我试着跟踪鼠标，看看它是否在容器中，但它似乎太昂贵和复杂，无法实现。最后，我决定按照下面的说明选择.data路由

我还有一把小提琴演示：

代码

在mouseleave侦听器上，如果悬停或悬停元素是relatedTarget，则保持打开状态

var$hover=$'MeHover'； var$hover=$I超过你； $body.append$hover； $hovered.add$hoverer.mouseenterfunction{ $hover.fadeIn； }.小老鼠{ 如果e.relatedTarget！=$hover[0]&&e.relatedTarget！=$hover[0] $hover.fadeOut； }; .结束{ 显示：无； 位置：绝对位置； 顶部：20px； 左：0； 右：0； 背景：绿色 } 在我上空盘旋 只是，哇。relatedTarget事件目标。精神崩溃了。你看，这就是为什么我爱你。你以为你把它放下了，然后有人就用你不知道的东西把你从水里吹了出来。智力+1。

var 
    hov = $("<div class=\"over\">I'm Over You</div>"),
    box = $("<div>Result: WAITING</div>")


$("body").append(hov).append(box);

$("#MeHover").on('mouseleave', function(){
    var d = new Date();
    box.text("Result: " + hov.is(":hover").toString().toUpperCase() );
});

var 
    hov = $("<div class=\"over\">I'm Over You</div>"),
    box = $("<div>Result: WAITING</div>");

$("body").append(hov).append(box);

$("#MeHover").add(hov).mouseenter(function () {
  $("#MeHover").data("keepHover", 1);
  hov.fadeIn();
}).mouseleave(function () {
  $("#MeHover").removeData("keepHover");
  CloseHover();
});

function CloseHover(){
  clearTimeout(t);
  var t = setTimeout(function () {
      if ($("#MeHover").data("keepHover") != 1)
          hov.fadeOut();
  }, 300);
}