0

ユーザーがマウスをページの外に移動したときにメッセージを表示するWebページがあります。InternetExplorerを除くすべてのブラウザですべてが完全に機能します。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

次のようにコードを追加しました

        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
        }

    }

ユーザーが選択要素の上にマウスを持っている場合、これはダミーの値を入力します。

于 2012-04-23T14:03:17.817 に答える
0

イベントのターゲット (srcElement) がドキュメントの場合、e.clientX は e.pageX のようにのみ機能します。

テーブルと配置された要素、およびフォーム要素では、含まれている要素のオフセットを考慮する必要があります-

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

また、mouseY についても同様です。

srcElement が本体になるまでは、mousemove を無視する方が簡単です。

于 2012-04-12T16:01:03.243 に答える