的MouseEnter故障悬停在链接后

Question

我有一个函数，当我将鼠标悬停在一个文本段落，但是当我从普通文本走在段落的超链接鼠标悬停事件停止，并且不会重新启动，直到我的鼠标，增加了一个信息的div离开段落并重新悬停在其上。如果我从链接开始，它会显示，但如果我从链接转到文本或文本到链接，它将始终停止。

段落的例子：

<div id="NoteHolder"> 
    <div class="wrap"> 
     <p class="NoteOp inline date1471280868332">Example sentence <a target="_blank" class="a" href="https://www.example.com">https://www.example.com</a></p> 
    </div> 
</div> 

当我悬停在它的日期数类转换为人类可读的日期的段落和它显示在一个div。

鼠标悬停事件：

$('#NoteHolder').on("mouseenter", ".NoteOp", function() { 
    var Info = document.createElement('div'); 
    Info.className = 'EditInfo' 
    var DateP = document.createElement('p'); 
    DateP.className = 'DivP'; 
    var DatePT = document.createTextNode(PT) 
    DateP.appendChild(DatePT); 
    Info.appendChild(DateP); 
    var position = $(this).position(); 
    var thisX = position.left; 
    var thisY = position.top; 
    var thisWidth = $(this).width(); 
    var thisHeight = $(this).height(); 
    var PageW = $('html').width(); 
    if(thisX + thisWidth + 50 > PageW) { 
     $(Info).css({ 
      "left": thisX + thisWidth + 20, 
      "top": thisY - 10 
     }); 
    } 
    document.getElementById("NoteHolder").appendChild(Info); 
}); 

$('#NoteHolder').on("mouseout", ".NoteOp", function() { 
    $(".EditInfo").remove(); 
}); 

反正当我将鼠标悬停在链接从取出DIV解决这一问题？

Answer 1

有一个错字错在你的代码，额外的右括号这将导致此问题，下面是更正后的代码

$(function() { 
 
$('#NoteHolder').on("mouseover", ".NoteOp", function() { 
 
    alert("Enter"); 
 
    var Info = document.createElement('div'); 
 
    Info.className = 'EditInfo' 
 
    var DateP = document.createElement('p'); 
 
    DateP.className = 'DivP'; 
 
    var DatePT = document.createTextNode(PT) 
 
    DateP.appendChild(DatePT); 
 
    Info.appendChild(DateP); 
 
    var position = $(this).position(); 
 
    var thisX = position.left; 
 
    var thisY = position.top; 
 
    var thisWidth = $(this).width(); 
 
    var thisHeight = $(this).height(); 
 
    var PageW = $('html').width(); 
 
    if(thisX + thisWidth + 50 > PageW) { 
 
     $(Info).css({ 
 
      "left": thisX + thisWidth + 20, 
 
      "top": thisY - 10 
 
     }); 
 
    } 
 
    document.getElementById("NoteHolder").appendChild(Info); 
 
    
 
}); 
 

 
$('#NoteHolder').on("mouseout", ".NoteOp", function() { 
 
    alert("Exit"); 
 
    $(".EditInfo").remove(); 
 
}); 
 

 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="NoteHolder"> 
 
    <div class="wrap"> 
 
     <p class="NoteOp inline date1471280868332">Example sentence <a target="_blank" class="a" href="https://www.example.com">https://www.example.com</a></p> 
 
    </div> 
 
</div>

当你正在使用jQuery的，你可以创建一个通过这个问题$("<div/>")而非document.createElement('div')