D.R.: Eventhandler per Javascript notieren

Hallo,

Man kann mit Hilfe von Javascript ja z.B. etwas in folgender Form notieren:
document.getElementsByTagName("a")[0].href = "javascript:myscript();".

Wenn ich das Gleiche allerdings mit einem Eventhandler (z.B. onclick) versuche, wird dieser nicht eingefügt.

Meine Frage: Gibt es irgendeine Spezialnotation, wie z.B. bei class (className)?
Oder muss ich unbedingt "creteElement" verwenden, was ja leider etwas Quelltext-lastig ist?

Hier mal eine Beispielseite.

mfg. Daniel

  1. hi,

    Meine Frage: Gibt es irgendeine Spezialnotation, wie z.B. bei class (className)?
    Oder muss ich unbedingt "creteElement" verwenden, was ja leider etwas Quelltext-lastig ist?

    Das Thema wird doch alle paar Tage hier behandelt ...

    Beispielsweise so
    event.onclick = funktionsreferenz;
    oder so
    event.onclick = function() { tuWasAuchImmerMit(x); }

    gruß,
    wahsaga

    --
    /voodoo.css:
    #GeorgeWBush { position:absolute; bottom:-6ft; }
    1. Hallo,

      Meine Frage: Gibt es irgendeine Spezialnotation, wie z.B. bei class (className)?
      Oder muss ich unbedingt "creteElement" verwenden, was ja leider etwas Quelltext-lastig ist?

      Das Thema wird doch alle paar Tage hier behandelt ...

      Sorry, ich bin zwar ziemlich oft hier, hab aber noch nie einen solchen Thread gesehen. :-(

      Beispielsweise so
      event.onclick = funktionsreferenz;
      oder so
      event.onclick = function() { tuWasAuchImmerMit(x); }

      Wenn ich dich richtig verstehe, muss ich also "event" davorschreiben.

      Ok, hab ich gemacht.
      Jetzt meldet sich die JavaScript-Konsole mit der Meldung:

      ########
      Fehler: document.getElementById("eventhandler").event has no properties
      Quelldatei: file:///G:/Meine%20Webseite/Eventhandler_in_Js.html
      Zeile: 24
      ########

      Was ist jetzt schon wieder falsch?
      das document.get... ist richtig (Versuch mit .style.border...) war erfolgreich!
      Den Inhalt des Eventhandlers kann man doch genauso schreiben, wie wenn man ihn in's HTML einbetten würde oder?

      Ich hab das Beispiel mal aktualisiert, leider klappt's immer noch nicht.

      mfg. Daniel

      1. Hello out there!

        Wenn ich dich richtig verstehe, muss ich also "event" davorschreiben.

        Nein.

        Fehler: document.getElementById("eventhandler").event has no properties
        Was ist jetzt schon wieder falsch?

        document.getElementById("eventhandler").event.onclick="alert('Hallo Welt')"

        'onclick' ist keine Eigenschaft von 'document.getElementById("eventhandler").event', sondern von 'document.getElementById("eventhandler")'.

        See ya up the road,
        Gunnar

        --
        “Remember, in the end, nobody wins unless everybody wins.” (Bruce Springsteen)
        1. Hallo,

          Wenn ich dich richtig verstehe, muss ich also "event" davorschreiben.

          Nein.

          Hä? Das hat Wahsaga doch gerade geschrieben, oder hab ich das falsch verstanden?

          Fehler: document.getElementById("eventhandler").event has no properties
          Was ist jetzt schon wieder falsch?

          document.getElementById("eventhandler").event.onclick="alert('Hallo Welt')"

          'onclick' ist keine Eigenschaft von 'document.getElementById("eventhandler").event', sondern von 'document.getElementById("eventhandler")'.

          Das versteh ich jetzt nicht.
          Du meinst also, ich soll:
          document.getElementById("eventhandler").onclick = "..."
          schreiben?
          Aber gerade das geht doch bei mir nicht. Die JS-Konsole meldet zwar nichts, aber es passiert auch nichts :-(

          (Eventhandler ist übrigens kein eventhandler, sondern eine Element, das einen Eventhandler bekommen soll)

          mfg. Daniel

          1. Hello out there!

            Wenn ich dich richtig verstehe, muss ich also "event" davorschreiben.
            Hä? Das hat Wahsaga doch gerade geschrieben, oder hab ich das falsch verstanden?

            (Eventhandler ist übrigens kein eventhandler, sondern eine Element, das einen Eventhandler bekommen soll)

            Genau das meinte wahsaga mit 'event' wohl auch: dieses  eine Element, das einen Eventhandler bekommen soll.

            Und wahsaga schrieb auch nichts von
              ...onclick = "alert('Hallo Welt')",
            sondern was von
              ...onclick = funktionsreferenz;
            oder
              ~~~javascript ...onclick = function() {
                "alert('Hallo Welt')"
              };

              
            See ya up the road,  
            Gunnar
            
            -- 
            “Remember, in the end, nobody wins unless everybody wins.” (Bruce Springsteen)
            
            1. Hello out there!

              Copy’n paste error detected!

              So sollte’s sein:
                ~~~javascript ...onclick = function() {
                  alert('Hallo Welt');
                };

                
              See ya up the road,  
              Gunnar
              
              -- 
              “Remember, in the end, nobody wins unless everybody wins.” (Bruce Springsteen)
              
              1. Hallo,

                Hello out there!

                Copy’n paste error detected!

                So sollte’s sein:
                  ~~~javascript

                ...onclick = function() {

                alert('Hallo Welt');
                  };

                  
                Ah, jetzt geht's.  
                Allerdings verstehe ich die Funktion nicht so richtig.  
                Warum steht im generierten Quelltext (DOM-Inspector) kein onclick="..."? Ich verstehe die Arbeitsweise also irgendwie nicht... Naja, Hauptsache es funktioniert erstmal!  
                Den Rest kann ich ja selbst rausfinden.  
                  
                Vielen Dank nochmal!  
                  
                mfg. Daniel
                
                -- 
                [Experten raten von der Verwendung des Internet Explorers ab!](http://web.oesterchat.com/internet-explorer/)  
                [Diese Programme](http://danielrichter.da.funpic.de/Testumgebung.html) braucht man, um Webseiten zu bauen!  
                [Mein SELF-stylesheet](http://danielrichter.da.funpic.de/SELFForumsCSS.html)  
                [Darum Firefox!](http://www.firefox-love.de/)  
                [Selfcode](http://forum.de.selfhtml.org/cgi-bin/selfcode.pl): [ie:{ fl:| br:> va:| ls:# fo:| rl:( n4:# ss:{ de:> js:| ch:? mo:) zu:}](http://www.peter.in-berlin.de/projekte/selfcode/?code=ie%3A%7B+fl%3A%7C+br%3A%3E+va%3A%7C+ls%3A%23+fo%3A%7C+rl%3A%28+n4%3A%23+ss%3A%7B+de%3A%3E+js%3A%7C+ch%3A%3F+mo%3A%29+zu%3A%7D)
                
            2. Hallo,

              Wenn ich dich richtig verstehe, muss ich also "event" davorschreiben.
              Hä? Das hat Wahsaga doch gerade geschrieben, oder hab ich das falsch verstanden?

              (Eventhandler ist übrigens kein eventhandler, sondern eine Element, das einen Eventhandler bekommen soll)

              Genau das meinte wahsaga mit 'event' wohl auch: dieses  eine Element, das einen Eventhandler bekommen soll.

              So steht's jedenfalls auch in meinem Beispiel.

              Und wahsaga schrieb auch nichts von
                ...onclick = "alert('Hallo Welt')",

              Ist das nicht egal? Ich kann das in's HTML doch auch so schreiben, warum sollte das auf diese Weise nicht gehen? Aber gut, es funktioniert ja nicht...

              sondern was von
                ...onclick = funktionsreferenz;

              ... also hab ich eine funktion notiert und die Funktionsreferenz (das ist doch eine oder) dort rein geschrieben.
              Leider funktioniert es nicht wie vor nicht (ob ich event weg lasse oder nicht, ist egal -> gleiches Ergebnis). Die JS-Konsole sagt:

              ###########
              Fehler: syntax error
              Quelldatei: http://danielrichter.da.funpic.de/test/Eventhandler_in_Js.html
              Zeile: 24, Spalte: 66
              Quelltext:
              document.getElementById("eventhandler").event.onclick=Testalert();}
              ###########

              mfg. Daniel

              1. Hello out there!

                document.getElementById("eventhandler").event.onclick=Testalert();}

                ▲1 ▲2
                ▲1 Die runden Klammern sind falsch.

                ▲2 Dass die geschweifte zuviel ist, hätte dir auch auffallen können.

                See ya up the road,
                Gunnar

                --
                “Remember, in the end, nobody wins unless everybody wins.” (Bruce Springsteen)
                1. Hallo,

                  document.getElementById("eventhandler").event.onclick=Testalert();}
                                                                                    ▲1 ▲2
                  ▲1 Die runden Klammern sind falsch.

                  Wieso? Wenn ich eine woanders definierte Funktion aufrufe, dann sind die runden Klammern Pflicht. Oder irre ich mich da?

                  ▲2 Dass die geschweifte zuviel ist, hätte dir auch auffallen können.

                  Stimmt, der gehört da nicht hin - Außer es ist das Ende einer Funktion dessen Anfang du nicht kennst ;-)

                  Ist ja aber auch egal - ich weiß ja jetzt wie's geht!

                  mfg. Daniel

                  1. Hallo Daniel.

                    document.getElementById("eventhandler").event.onclick=Testalert();}
                                                                                      ▲1 ▲2
                    ▲1 Die runden Klammern sind falsch.

                    Wieso? Wenn ich eine woanders definierte Funktion aufrufe, dann sind die runden Klammern Pflicht.

                    Eben. Und du willst *an dieser Stelle* ja die Funktion nicht aufrufen, sondern lediglich festlegen, dass sie aufgerufen werden soll, wenn das jeweilige Ereignis eintritt.

                    Einen schönen Freitag noch.

                    Gruß, Mathias

                    --
                    sh:( fo:} ch:? rl:( br: n4:~ ie:{ mo:| va:) de:> zu:} fl:( ss:) ls:[ js:|
                    debian/rules
                    1. Hallo,
                      document.getElementById("eventhandler").event.onclick=Testalert();}

                      ▲1 ▲2
                      ▲1 Die runden Klammern sind falsch.

                      Wieso? Wenn ich eine woanders definierte Funktion aufrufe, dann sind die runden Klammern Pflicht.

                      Eben. Und du willst *an dieser Stelle* ja die Funktion nicht aufrufen, sondern lediglich festlegen, dass sie aufgerufen werden soll, wenn das jeweilige Ereignis eintritt.

                      Naja, irgendwie bin ich noch zu sehr an diesem "Attribut-notier-Denken" drin. Ich ging also eigentlich davon aus, dass man onclick="meinefunktion()" intern in den DOM-Baum einhängen muss (ähnlich wie bei createAttribute). Aber irgendwie läuft das anders...

                      Aber ist ja auch egal - ich hab's jetzt einfach mit function(){meinJSCode} gelöst. Funktioniert hervorragend!

                      mfg. Daniel

  2. n'abend,

    Man kann mit Hilfe von Javascript ja z.B. etwas in folgender Form notieren:
    document.getElementsByTagName("a")[0].href = "javascript:myscript();".
    Wenn ich das Gleiche allerdings mit einem Eventhandler (z.B. onclick) versuche, wird dieser nicht eingefügt.

    document.getElementsByTagName("a")[0].onclick = function(){ alert('so besser?') };

    weiterhin schönen abend...

    --
    wer braucht schon großbuchstaben?
    sh:( fo:# ch:# rl:° br:> n4:& ie:{ mo:} va:) de:] zu:} fl:{ ss:? ls:[ js:|
  3. Moin!

    Versuch doch mal:
    document.getElementsByTagName("a")[0].setAttribute( 'onclick', 'myscript();')

    -- Skeeve

    1. Hello out there!

      Versuch doch mal:
      document.getElementsByTagName("a")[0].setAttribute( 'onclick', 'myscript();')

      Und warum sollte man das tun?

      See ya up the road,
      Gunnar

      --
      “Remember, in the end, nobody wins unless everybody wins.” (Bruce Springsteen)
      1. n'abend,

        document.getElementsByTagName("a")[0].setAttribute( 'onclick', 'myscript();')

        Und warum sollte man das tun?

        Weil einem der Internet Explorer sonst zu langweilig erscheint?

        "Davon abgesehen hat setAttribute() eine noch viel größere Tücke: Im Internet Explorer hat die Methode einen Fehler. Sie müssen bei einigen Attributen eine spezielle Schreibweise des Attributnamens beachten, damit der Internet Explorer das Attribut tatsächlich setzt."

        weiterhin schönen abend...

        --
        wer braucht schon großbuchstaben?
        sh:( fo:# ch:# rl:° br:> n4:& ie:{ mo:} va:) de:] zu:} fl:{ ss:? ls:[ js:|
        1. Hello out there!

          document.getElementsByTagName("a")[0].setAttribute( 'onclick', 'myscript();')

          Und warum sollte man das tun?

          Weil einem der Internet Explorer sonst zu langweilig erscheint?

          Nein. Ich meinte, warum sollte man einen Eventhandler als Attribut einhängen?

          See ya up the road,
          Gunnar

          --
          “Remember, in the end, nobody wins unless everybody wins.” (Bruce Springsteen)
          1. Moin!

            Nein. Ich meinte, warum sollte man einen Eventhandler als Attribut einhängen?

            1. Weil er nach sowas (ähnlichem) gefragt hat
            2. Nimm an, Du möchtest einen anchor so per JavaScript ändern,
               daß dieses dabei heraus kommt: <a href="#" onclick="myscript(this">
               Wie könnte das anders (außer über innerHTML) noch lösen?
            Ich frage dies auch, weil ich genau gestern das brauchte und wie angegeben gelöst habe.

            -- Skeeve

              1. Nimm an, Du möchtest einen anchor so per JavaScript ändern,
                   daß dieses dabei heraus kommt: <a href="#" onclick="myscript(this">
                   Wie könnte das anders (außer über innerHTML) noch lösen?
                Ich frage dies auch, weil ich genau gestern das brauchte und wie angegeben gelöst habe.

              so:

              [Objeckt].onclick = function(e)
              {
              myscript(this);
              }

              Struppi.

              --
              Javascript ist toll (Perl auch!)
            1. n'abend,

              1. Nimm an, Du möchtest einen anchor so per JavaScript ändern,
                   daß dieses dabei heraus kommt: <a href="#" onclick="myscript(this">
                   Wie könnte das anders (außer über innerHTML) noch lösen?
                Ich frage dies auch, weil ich genau gestern das brauchte und wie angegeben gelöst habe.

              du brauchst die setAttribute Funktion nicht.

              var obj = document.getElementById('meinAnker');  
              obj.einAttribut = 1;  
              obj.onclick = function()  
              {  
                alert( this.einAttribut );  
                return false;  
              }
              

              sollte seinen Job erledigen...

              weiterhin schönen abend...

              --
              wer braucht schon großbuchstaben?
              sh:( fo:# ch:# rl:° br:> n4:& ie:{ mo:} va:) de:] zu:} fl:{ ss:? ls:[ js:|
            2. Hello out there!

              1. Nimm an, Du möchtest einen anchor so per JavaScript ändern,
                   daß dieses dabei heraus kommt: <a href="#" onclick="myscript(this">

              Sehr schlechte Annahme; ich möchte keinesfalls, dass so etwas herauskommt. Und ich meine nicht die fehlende ')'.

              Was soll der Anker zum Seitenanfang? Ins 'href'-Attribut gehört der URI der Ressource, die auch ohne JavaScript den Inhalt liefert.

              Dass eine Navigation, die nur mit JavaScript möglich ist, wertlos ist, sollte sich inzwischen doch schon herumgesprochen haben.

              See ya up the road,
              Gunnar

              --
              “Remember, in the end, nobody wins unless everybody wins.” (Bruce Springsteen)
              1. Moin!

                Dass eine Navigation, die nur mit JavaScript möglich ist, wertlos ist, sollte sich inzwischen doch schon herumgesprochen haben.

                Mist! Schon wieder vergessen anzugeben, daß das ganze für eine Application ist, die ohnehin nur mit JS läuft. Zudem steht doch da oben, daß der Anchor per JS generiert wird, also ist es, denke ich, eine valide Annahme, daß JS aktiv ist.

                Der Ursprungsanker sieht so aus:
                   <a href="datei.html">anchortext</a>
                Daraus mach ich per JS
                   <a href="#" onclick="dolink(this, 'datei.html')">anchortext</a>

                Allerdings werde ich jetzt diesen Ansatz probieren, daraus zu generieren:
                   <a href="datei.html" onclick="dolink()">anchortext</a>
                mit den, an anderer Stelle beschriebenen Möglichkeiten über *this* an das Anchor Elment zu gelangen.

                -- Skeeve

                1. Hi,

                  Mist! Schon wieder vergessen anzugeben, daß das ganze für eine Application ist, die ohnehin nur mit JS läuft.

                  :)

                  Wenn ich einen A-Link mit JS-Funktionalität mache, dann verwende ich einen URL mit Pseudoprotokoll javascript:! Wenn ich das nicht möchte, dann brauche ich auch kein A-Element. Ein onclick braucht jedenfalls keines ...

                  Davon abgesehen: Warum sollte ich einen Eventhandler als Attribut in den DOM-Baum hängen, wenn ich das Element selbst einfach direkt damit versehen kann?

                  Gruß, Cybaer

                  --
                  Hinweis an Fragesteller: Fremde haben ihre Freizeit geopfert, um Dir zu helfen. Helfe Du auch im Archiv Suchenden: Beende deinen Thread mit einem "Hat geholfen" oder "Hat nicht geholfen"!
                  1. Moin!

                    Davon abgesehen: Warum sollte ich einen Eventhandler als Attribut in den DOM-Baum hängen, wenn ich das Element selbst einfach direkt damit versehen kann?

                    Wie oben beschrieben: Ich wußte nicht, wie ich anders an das Anchor Element komme. Ich mußte ja irgendwie "this" rein bekommen.

                    Nun weiß ich es ja besser.

                    -- Skeeve

  4. Man kann mit Hilfe von Javascript ja z.B. etwas in folgender Form notieren:
    document.getElementsByTagName("a")[0].href = "javascript:myscript();".

    Das wäre Unsinn, du willst ja eine Funktion ausführen und keinen Link

    Wenn ich das Gleiche allerdings mit einem Eventhandler (z.B. onclick) versuche, wird dieser nicht eingefügt.

    Sicher wird er das, was auch der Sinnvollere weg wäre, um eine JS Funktion auszuführen.

    In deinem Fall geht's ohne Probleme, in fast allen Browsern so:

      
    document.getElementsByTagName("a")[0].onclick = myscript;
    ~~~.  
      
    In der Funktion myscript() ist dann this gleich dem Element und der erste Parameter der Funktion ist, zumindest in Mozilla Browsern, ein event Objekt.  
      
    Struppi.
    
    -- 
    [Javascript ist toll](http://javascript.jstruebig.de/) (Perl auch!)