4

我在页面中有一张图片，onmouseover如果出现该图片，我将调用 JavaScript 函数来显示工具提示，在onmouseout图片中，我将调用一个方法来隐藏工具提示。现在我发现当我将光标放在图像上时，它正在调用显示工具提示div的方法。

如果我在图像中移动鼠标，它会调用onmouseout事件（即使我不在图像之外）。我怎样才能阻止这个？我想onmouseout在光标不在图像时被调用。有什么想法吗？

我是这样称呼它的：

 <img src="images/customer.png" onmouseout="HideCustomerInfo()" onmouseover="ShowCustomerInfo(485)" />

在我的 JavaScript 中：

 function ShowCustomerInfo(id) {


 var currentCustomer = $("#hdnCustomerId").val();   
 if (currentCustomer != id) { // to stop making an ajax call everytime when the mouse move on the same image
     
     $.get('../Lib/handlers/userhandler.aspx?mode=custinfo&cid=' + id, function (data) {
         strHtml = data;
     });

     tooltip.show(strHtml);   // method in another jquery pluggin
     $("#hdnCustomerId").val(id);
 }
}

function HideCustomerInfo() {

 tooltip.hide();    // method in another jquery pluggin
 $("#hdnCustomerId").val(0); //setting in a hidden variable in the page

 }
4

4 回答 4

2

我假设您正在将鼠标悬停在您的工具提示上？并且工具提示的标记超出了图像的范围？

因此，通过将鼠标悬停在工具提示上，您在技术上将离开图像。我也有类似的事情发生在我身上。

要解决这个问题，请尝试div在图像周围粘贴 a 并将鼠标事件放在 上div，然后作为子元素添加到div您的工具提示中，因此即使您将鼠标悬停在工具提示上，您仍然在div.

那可能行得通。

于 2010-09-27T16:23:48.253 回答
1

如果您用来悬停的图像具有透明度（它是 png，对），那么当您将鼠标移到图像的透明部分上时，您将收到一个 onmouseout 事件。是的，这很糟糕。我有同样的问题，还没有优雅的解决方案。

于 2013-03-25T17:58:41.900 回答
1

解决此问题的另一种简单方法是设置pointer-events: none工具提示

于 2020-09-30T02:10:44.763 回答
0

你确定HideCustomerInfo()是由onmouseout图像的事件处理程序调用的吗？另外，您在哪些浏览器中获得它？你在一个特定的浏览器中得到这种行为吗？

于 2010-09-27T16:59:45.793 回答