Jochen: Mehrere Anweisungen im Event-Handler

Hallo,
wie unter http://de.selfhtml.org/javascript/sprache/eventhandler.htm zu lesen ist, sollte man bei mehreren Anweisungen im Event-Handler am besten eine Funktion im JavaScript Bereich definieren und dann entsprechend im HTML-Tag aufrufen.
Ich würde nun gerne eine Grafik mit den onMouseOver und onMouseOut Events belegen und jeweils zwei Anweisungen durchführen. Sobald die Maus über der Grafik ist soll ein existierender Filter auf der Grafik ausgeschaltet werden und die Startzeit genommen werden. Sobald die Maus wieder weg ist soll der Filter wieder eingeschaltet und eine Ausgabe mit der Aufenthaltsdauer auf der Grafik angezeigt werden.
Ich habe es mit folgendem Code probiert, der aber nicht funktioniert --> Liegt es an der Kombination der beiden Funktionen?

<html><head><title>Script-Filter</title>

<script type="text/javascript">

Function beginn() {
var Start = new Date();
var Startzeit = Start.getTime();
}

function Aufenthalt() {
 var Ende = new Date();
 var Endzeit = Ende.getTime();
 var Aufenthalt = Math.floor((Endzeit - Startzeit) / 1000);
 alert("Sie waren " + Aufenthalt + " Sekunden auf diesem Element");
}

function grafEffektAus() {
 a3.filters.item(0).enabled = 0;
}

function grafEffektEin() {
 a3.filters.item(0).enabled = 1;
}

function beiMausRein() {
 grafEffektAus() + beginn();
}

function beiMausRaus() {
 grafEffektEin() + Aufenthalt();
}
</script>

<style type="text/css">
  <!--
  img#a3 {filter:progid:DXImageTransform.Microsoft.Pixelate(maxsquare=9)}
-->
</style>

</head>
<body>
<img src="C:/Eigene Dateien/Eigene Bilder/cepal2.gif" id="a3" width="200" height="200" onMouseOver="beiMausRein()" onMouseOut="beiMausRaus()">
</body>
</html>

  1. Hallo Jochen,

    function beiMausRein() {
    grafEffektAus() + beginn();
    }

    function beiMausRaus() {
    grafEffektEin() + Aufenthalt();
    }

    Für die Funktionen grafEffektAus(), beginn(), grafEffektEin() und Aufenthalt() sind keine Rückgaben definiert (es fehlt ihnen ein return([...])).
    Daher ist der Ausdruck NULL + NULL für den Browser nichtssagent, sollte aber unter der Bedingung, daß damit eine Variable gefüllt wird, eigentlich ordentlich abgearbeitet werden (also: var t = grafEffektEin() + Aufenthalt();)

    Lange rede kurzer sind: Schreibe bitte so:

    function beiMausRein() {grafEffektAus(); beginn();}
    function beiMausRaus() {grafEffektEin(); Aufenthalt();}

    Gruß aus Berlin!
    eddi

    1. Hallo Eddi,
      danke für deinen Hinweis! Ich habe jetzt mal den Code generell verändert, denn mit deiner Verbesserung alleine hat auch noch nichts funktioniert. Der neue Code funktioniert aber leider auch nicht und ich finde einfach nicht heraus warum. Es müsste aber an der Funktion von onMouseOut liegen. Außerdem würde mich noch interessieren wie ich an Stelle des Alerts die Zeit auch in dem Formular ausgeben kann welches unter der Grafik zu sehen ist. Geht das mit (document.form.Eingabe.value = Anfangszeitpunkt;)?
      Vielen Dank für eure Mühen!
      Ciao, Jochen.

      Hier der Code:

      <html><head><title>Test</title>
      <script type="text/javascript">
      <!--
      var Start = new Date();
      var Startzeit = Start.getTime();

      function AnfangElement() {
      var Anfang = new Date();
      var Anfangszeit = Anfang.getTime();
      var Anfangszeitpunkt =  (Anfangszeit - Startzeit) / 1000;
      a3.filters.item(0).enabled = 0;

      }

      function EndeElement() {
       var Ende = new Date();
       var Endzeit = Ende.getTime();
       var Endzeitpunkt = (Endzeit - Startzeit) / 1000;
       var ZeitAufElement = Endzeitpunkt - Anfangszeitpunkt;
       a3.filters.item(0).enabled = 1;
       alert("Sie waren " + ZeitAufElement + " Sekunden auf dem Element.");
      }

      // -->
      </script>
      </head>
      <body>
      <img src="C:/Eigene Dateien/Eigene Bilder/cepal2.gif" id="a3" style="filter:progid:DXImageTransform.Microsoft.Pixelate(maxsquare=9)" width="200" height="200" onMouseOver="AnfangElement()" onMouseOut="EndeElement()">
      <p>
      <form name="Zeit" action="">
      Zeit in Sekunden: <input type="text" name="Eingabe" readonly>
      </form>
      </body></html>

      1. Hallo Jochen,

        <html><head><title>Test</title>
        <script type="text/javascript">
        <!--
        function AnfangElement()
         {
         var Anfang=new Date()
         document.getElementsByTagName("span")[0].innerHTML=Date.parse(Anfang)
         }

        function EndeElement()
         {
         var Ende=new Date()
         var Endzeitpunkt = (Date.parse(Ende) - document.getElementsByTagName("span")[0].innerHTML) / 1000
         document.getElementsByTagName("p")[0].innerHTML="Sie waren " + Endzeitpunkt + " Sekunden auf dem Element.";
         }

        // -->
        </script>
        </head>
        <body>
        <img src="C:/Eigene Dateien/Eigene Bilder/cepal2.gif" id="a3" style="filter:progid:DXImageTransform.Microsoft.Pixelate(maxsquare=9)" width="200" height="200" onMouseover="AnfangElement()" onMouseout="EndeElement()">
        <p></p>
        <span style="display:none"></span>
        </body></html>

        dies würde nach Deinen Vorstellungen seinen dienst tun. Aber mal gans anders gefragt, warum arbeitest Du nicht setTimeout() und setTimeout()?
        http://de.selfhtml.org/javascript/objekte/window.htm#clear_timeout Da ist auch ein schönes Beispiel ;)

        Gruß aus Berlin!
        eddi