的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')