2

OK たぶん、これと似たようなことを尋ねたことがありますが、これは私が抱えている別の問題です。コードを表示することから始めます。

var MyClass = {
    // Set up the events for the parent
    // MyParent is a DIV
    SetEvents: function() {
         MyParent.onmouseover = function() { MyClass.MouseHover(MyParent); };
         MyParent.onmouseout = function() { MyClass.MouseOut(MyParent); };
    },

    // Function activated when moving the mouse over the parent
    MouseHover: function(Parent) {
        if (Parent) {
        // Here I create the child, when moving the mouse over the parent control
        // The child is an IMG
            var child = document.createElement("img");
                child.id = "child";
                child.src = "child.png";
                child.style.float = "right";
            Parent.appendChild(child);
        }
    },

    // Function activated when moving the mouse out of the parent control
    MouseOut: function(Parent) {
        if (Parent) {
            var child = document.getElementById("child");
            if (child) {
                // On mouse out I remove the child
                Parent.removeChild(child);
            }
        }
    }
}

つまり、これは、マウスを の上に移動すると表示される単純な画像であり、マウスを離すとdiv消えます。しかし、これは私が望むように動作していません。

問題は、マウスが親の上にあるときに、マウスをdiv子の上に移動するとimg（まだ親の上に）、MouseOut()関数が起動されることです。

ここ数日、解決策とコツを探していましたが、すべてが無駄でした. さて、誰かが問題を特定できることを願っています。私が見逃した JavaScript の章がいくつかあるはずです。みんなに感謝！

これをよりよく説明するために、いくつかの画像を追加しました

ケース1 ケース 2 ケース 3 ケース 4

更新 これは、 IMG の子が動的に作成された場合にのみ発生するようです。以前に作成し、src のみを変更すると、機能します。

JSSFIDLE DEMO http://jsfiddle.net/E9q6e/1/ で、このスクリプトが動作しているのを確認できます (まあ、動作していない、と言ったほうがよいでしょう)。

4

1 に答える 1

0

inParentが含まれているかどうかを確認してみてください。childMouseOut()

var ref=event.toElement || event.relatedTarget; // This line is pseudocode
if(!Parent.contains(ref)){
  Parent.removeChild(child);
}
于 2012-05-18T12:14:12.640 に答える