0

我有一个网页，当用户将鼠标移出页面时会显示一条消息。除 Internet Explorer 外，所有浏览器均可完美运行。在 Internet Explorer 中，我的代码可以正常工作，除非用户单击表单选择项。当用户从下拉列表中选择一个项目时，clientX 和 clientY 报告一个不正确的值，这使得我的消息显示就好像用户将鼠标移到页面外一样。仅当鼠标实际移出页面时才应显示该消息。我已经在为旧版本的 IE 使用解决方法。有谁知道解决此问题的不同方法，以便代码在较旧的 IE 浏览器 (7-8) 中正常工作？

这是我的代码：

if (document.addEventListener) {
    window.addEventListener("mouseout", popMessage, false);
} else {  // IE before version 9
    document.attachEvent ('onmouseout', popMessage);
}

.
.
.
.

var mouseX = 0;
var mouseY = 0;

function popMessage (e) {
    mouseX = e.pageX;
    mouseY = e.pageY;

    if ('pageX' in e) { // all browsers except IE before version 9
        var mouseX = e.pageX - document.documentElement.scrollLeft;
        var mouseY = e.pageY - document.documentElement.scrollTop;
    }
    else {  // IE before version 9
        mouseX = e.clientX + document.documentElement.scrollLeft;
        mouseY = e.clientY + document.documentElement.scrollTop;
    }

    if ((mouseY < 0 || mouseY > window.innerHeight-1)
    ||  (mouseX < 0 || mouseX > window.innerWidth-1))
    {
        abandonPanel.show();
        // alert("x:" + mouseX + "  y:" + mouseY + "  innerHeight:" + window.innerHeight + "  innerWidth:" + window.innerWidth);

        if (document.addEventListener) {
            window.removeEventListener("mouseout", popMessage, false);
        } else {  // IE before version 9
            document.detachEvent ('onmouseout', popMessage);
        }
    }
}
4

2 回答 2

1

Appended the code as follows

        else {  // IE before version 9
        if (e.srcElement.nodeName!="SELECT") { // IE reports inaccurate mouse information on SELECT elements
            mouseX = e.clientX + document.documentElement.scrollLeft;
            mouseY = e.clientY + document.documentElement.scrollTop;
        }
        else {
          mouseX = 50  
          mouseY = 50
        }

    }

This enters dummy values if the user has the mouse over a select element which keeps the javascript from misfiring.

于 2012-04-23T14:03:17.817 回答
0

e.clientX 仅在事件的目标 (srcElement) 是文档时才像 e.pageX 一样工作。

在表格和定位元素以及表单元素中，需要考虑包含元素的偏移量 -

var node=event.srcELement, mouseX=node.offsetLeft+event.clientX;
while(node.offsetParent){
  node=node.offsetParent;
  mouseX+=node.offsetLeft;
}

也适用于mouseY。

在 srcElement 是主体之前忽略鼠标移动会更简单。

于 2012-04-12T16:01:03.243 回答