mouseover 이벤트 mousecoordinates를 함수 입력으로 사용

Question

사용자가 a 태그를 가리키면 showPeopleDetails 함수를 실행해야하는 Java 서버 페이지가 있습니다. showPeopleDetails는 별도의 js 파일에있는 자바 스크립트 함수로, 프레임 워크에서 가져옵니다. showPeopleDetails는 a 태그 위에 풍선 팝업을 표시해야합니다. 어쨌든 함수는 첫 번째 a 태그 만 실행되지만 다른 태그는 실행되지 않습니다! 이것은 HTML 코드입니다 :

| <a href="javascript:void(0);" class="PeopleLink LinkColorBlackDark" onmouseover= "showPeopleDetails('<%=userUnique %>', event.clientX, event.clientY)" onmouseout="hidePeopleDetailsTimed()"></a> 

이 내 자바 스크립트 showPeopleDetails 기능입니다 :

function showPeopleDetailsNow(UserId, x, y){ 
    var vpd = document.getElementById("PeopleDetails"); 
    if (vpd != null) { 
     getMousePosition(); 
     vpd.style.top= x +10 + $(document).scrollTop(); //mouseX and mouseY are defined globally 
     vpd.style.left= y +10; 
     vpd.style.display="block"; 
    } 
} 

나는 그것을 테스트 한 웹 사이트의 다른 부분에 작동하고 showPeopleDetails 기능 아무 문제가 없습니다. 그러나 event.clientX 및 event.clientY를 추가하면 팝업은 한 번만 표시됩니다. 브라우저 호환성이 문제가되지 않도록 인터넷 익스플로러 8 만 개발하면됩니다. 도움을 많이 받으실 수 있습니다!

Answer 1

대신 함수 호출에 event.clientX 및 event.clientY을 전달하는 이벤트가 일 전달이

<a href="javascript:void(0);" class="PeopleLink LinkColorBlackDark" onmouseover= "showPeopleDetails('<%=userUnique %>', event)" onmouseout="hidePeopleDetailsTimed()"></a> 

function showPeopleDetailsNow(UserId, event){ 
    event = event || window.event; 
    var x = event.clientX, y = event.clientY; 

    var vpd = document.getElementById("PeopleDetails"); 
    if (vpd != null) { 
     getMousePosition(); 
     vpd.style.top= x +10 + $(document).scrollTop(); //mouseX and mouseY are defined globally 
     vpd.style.left= y +10; 
     vpd.style.display="block"; 
    } 
}