0

私はユーザーがaタグの上を移動するときに、showPeopleDetails関数を実行するJavaサーバーページを持っています。 showPeopleDetailsは、フレームワークによってインポートされる別個のjsファイル内のjavascript関数です。 showPeopleDetailsは、aタグの上にバルーンポップアップを表示する必要があります。どういうわけか、関数は最初のaタグに対してのみ実行され、他のものに対しては実行されません!これは、HTMLスニペットです:関数の入力としてmouseoverイベントのmousecoordinatesを使用します。

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

これは私のjavascriptの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を追加すると、ポップアップは一度だけ表示されます。私はInternet Explorer 8用に開発する必要があるので、ブラウザの互換性は問題ではありません。 多くのご協力をいただきました!

答えて

0

代わりに関数呼び出しで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"; 
    } 
} 
+0

感謝をしてみてください! – Abhischek

関連する問題