LenaLuna: Eventhandling im IE

hallo zusammen,

habe folgendes problem mit event-handling beim IE 4+:

HTML
----

<div name="ebene" id="ebene">
 <img name="bild" id="bild" src="bild.gif" />
</div>

JAVASCRIPT
----------

function handler()
{
 alert(event.srcElement.id);
}

registriere diesen handler für die Ebene wie folgt:

document.all["ebene"].attachEvent("onmouseover", handler);

oder

document.all["ebene"].onmouseover = handler;

wenn ich jetzt mit der maus über die ebene fahre wird für event.srcElement.id "ebene" ausgegeben.
sobald ich aber über das bild komme erhalte ich "bild".

ich möchte aber, dass immer "ebene" ausgegeben wird, auch wenn ich über andere elemente, die sich in der ebene befinden, fahre.

hat jemand/frau eine idee...

gruss LenaLuna

  1. Hi,

    document.all["ebene"].attachEvent("onmouseover", handler);

    document all ist eine veraltete, ie proprietaere Syntax. Verwende document.getElementById.

    wenn ich jetzt mit der maus über die ebene fahre wird für event.srcElement.id "ebene" ausgegeben.
    sobald ich aber über das bild komme erhalte ich "bild".

    Du musst pruefen, ob das feuernde Element in einem anderen enthalten ist. Fuer IE verwende die Methode "contains()", beim Mozilla musst Du Dich hierzu durch die Dom-Hirarchie hangeln. Eine Moeglichkeit ist die Funktion mozContains in der navi.js auf meiner Seite

    Gruesse, Joachim

    --
    Am Ende wird alles gut.
    1. hallo joachim,

      danke für die antwort.

      ist mir klar das document.all nicht aktuell ist.
      hiermit funktionieren einfach alle ie's.

      habe die funktion contains kurz angeschaut.
      die ist aber nur dazu da in der untergeordneten dokumentstruktur nach einer id zu suchen.

      ich werde wohl oder übel die dokumentstrukt nach oben mit der Eigenschaft offsetParent nach einem tagName "DIV" absuchen müssen.

      ich hatte gedacht das ginge einfacher.

      gruss LenaLuna

    2. Hallo,

      document.all["ebene"].attachEvent("onmouseover", handler);
      document all ist eine veraltete, ie proprietaere Syntax. Verwende document.getElementById.

      »attachEvent« ist ebenfalls »IE-proprietäre Syntax«, hier anscheinend bewusst.

      wenn ich jetzt mit der maus über die ebene fahre wird für event.srcElement.id "ebene" ausgegeben.
      sobald ich aber über das bild komme erhalte ich "bild".
      Du musst pruefen, ob das feuernde Element in einem anderen enthalten ist. Fuer IE verwende die Methode "contains()", beim Mozilla musst Du Dich hierzu durch die Dom-Hirarchie hangeln.

      Ich verstehe nicht ganz, wie man sich darüber abhelfen kann, wenn man das Element herausbekommen will, bei dem der Event registriert wurde. Dass das Element, welches man über target bzw. srcElement ansprechen kann, immer (in der DOM-Hierachie) inner- bzw. unterhalb desjenigen liegt, bei dem der Event registriert wurde, versteht sich ja von selbst. Und wenn ich sowieso eine Referenz auf dieses darüberliegende Element habe bzw. dessen ID bekannt und immer dieselbe ist, dann stellt sich die Ausgangsfrage nicht, sofern ich diese richtig verstehe.

      Im MSIE gibt es aber tatsächlich keine direkte Möglichkeit, über den Event an das Elementobjekt zu kommen, bei dem der Event registriert worden war. Im Mozilla gibt es currentTarget aus DOM 2 Events. Ich habe die konkrete Frage nicht genug verstanden, um eine Alternativlösung suchen zu können. Was hast du denn genau vor, LenaLuna?

      Mathias

      1. hallo mathias,

        danke für die antwort.

        das problem ist, dass sich natürlich mehrere ebenen auf der seite befinden die auch einen mouseover-out-event erhalten können. in diesen ebenen können bilder text usw. sein.

        ich muss also eine möglichkeit finden herauszubekommen welche ebenen-id oberhalb der dokumentenstruktur liegt.

        ich habe nachfolgende funktion erstellt.
        mit der funktioniert die sache.

        function geben_ebene(objekt_element)
        {
            if (objekt_element.tagName == "DIV")
                return objekt_element;

        if (objekt_element.offsetParent != null)
                return geben_ebene(objekt_element.offsetParent);

        return null;
        }

        ich übergebe ihr das event-einfangende objekt und sie hangelt sich rekursiv nach oben durch bis eine gültige ebene gefunden worden ist und liefert mir dieses objekt retur wenn nicht dann null.

        gruss LenaLuna

  2. hi,

    function handler()
    {
    alert(event.srcElement.id);
    }

    mit event.srcElement beziehst du dich ja ganz konkret auf das Element, auf dem das Ereigniss eintritt.

    Beziehe dich doch einfach auf das Element, auf dem der Eventhandler notiert ist:

    function handler()
    {
    alert(this.id);
    }

    gruß
    peter

    1. hallo peter,

      function handler()
      {
      alert(this.id);
      }

      das mit den this funktioniert.
      hatte ganz vergessen das this sich immer auf das objekt bezieht bei dem der handler registriert ist.

      nun kann ich meine schöne funktion wieder rausschmeissen ;-(

      gruss LenaLuna

      1. warum immer so kompliziert? man kann die ereignisroutine doch direkt im html anhängen:

        <HTML>
        <HEAD>
        <script type="text/javascript">
        <!--
        function onMouseOver(e) {
            //window.status = event.srcElement.id;
            window.status = e.id;
        }
        function onMouseOut() {
            window.status = '';
        }
        -->
        </script>
        </HEAD>
        <BODY>
        <div name="ebene" id="ebene" onmouseover="onMouseOver(this);" onmouseout="onMouseOut()";>
         <img name="bild" id="bild" src="bild.gif" />
        </div>
        </BODY>
        </HTML>

        das ist zudem auch wesentlich übersichtlicher.