Steffen Flämig: myImge.setAttribute("onclick", "testFunc");

Hallo,

Ich habe beim Erstellen meiner ersten Ajax Seite folgendes Problem:

Ich erzeuge ein neues IMAGE object:

var img = document.createElement("img");

Setze das src Attribut:

img.setAttribute("src", "http://www.blaBal...");

Bis hierher funktionierte wie es soll. Nach dem Einhängen des Bildes mit
parentDiv.appendChild(img);
wird das Bild im IE und im Mozilla angezeigt.

Nun soll das Klicken auf das Bild aber wieder eine JavaScript Funktion aufrufen.

Ich dachte an:
img.setAttribute("onclick", "testFunc");
Im Mozilla funktioniert das auch, nicht aber im IE. Es wird auch keine Fehlermeldung ausgegeben.

Was kann man da machen?

Gruß
Steffen

  1. Hellihello,

    wie wärs u.a. mit

    img = new Image;

    img.src="";

    sowie

    img.onclick=function();

    Gruß,

    frankx

  2. Hallo,

    Ich dachte an:
    img.setAttribute("onclick", "testFunc");
    Im Mozilla funktioniert das auch, nicht aber im IE. Es wird auch keine Fehlermeldung ausgegeben.

    Nein. Der IE kann onclick nicht im Sinne des Kern-DOM umsetzen. An dieser Stelle ist „setAttribute“ aber ohnehin nicht sonnvoll…

    Was kann man da machen?

    ing.onclick = function(){
    testFunc();
    }

    oder (Falls der Funktion keine Parameter zugewiesen werden müssen und this auf das Bild verweisen soll)

    ing.onclick = testFunc;

    mfg. Daniel

    1. Hallo,

      ing.onclick = function(){
      testFunc();
      }

      Danke, es funktioniert:-).

      Gruß
      Steffeb

    2. Hallo,

      jetzt habe ich doch noch ein Problem:

      An dieser Stelle ist „setAttribute“ aber ohnehin nicht sonnvoll…

      Warum eigentlich? (Das ist jetzt aber nicht mein Hauptproblem ;-)

      ing.onclick = function(){
      testFunc();
      }

      Das ganze sitzt in einer Schleife. Dort werden mehere Bilder erzeugt und jedes soll dieses onclick Attribut mit der gleichen testFunc() aber unterschiedlichen Funktionsparametern bekommen, also ungefähr:

      for (var index in list)
      {
        var img = document.createElement("img");
        img.setAttribute("src", "http...");
        img.onclick = function()
        {
          testFunc(index)
        }
        parentDiv.appendChild(img);
        .
        .
        .
      }
      Wenn ich das ganze jetzt ausprobiere, haben alle img's in ihren testFunc's den hösten vorkommenden index Wert. Offensichtlich wird bei
      img.onclick = function()
        {
          testFunc(index)
        }
      _allen_ in dieser Schleife erzeugten img Objekten der jeweisl neue Wert zugewiesen.
      Die mit setAttribute zugewiesenen Werte (z.B. src) sind wie gewünscht verschieden.

      Gruß
      Steffen

      1. Hallo,

        jetzt habe ich doch noch ein Problem:

        An dieser Stelle ist „setAttribute“ aber ohnehin nicht sonnvoll…
        Warum eigentlich? (Das ist jetzt aber nicht mein Hauptproblem ;-)

        Weil Eventhandler intern nicht als Attribut, sondern als Funktion verarbeitet werden. Der Browser muss das Attribut also erstmal konvertieren.

        ing.onclick = function(){
        testFunc();
        }
        Das ganze sitzt in einer Schleife. Dort werden mehere Bilder erzeugt und jedes soll dieses onclick Attribut mit der gleichen testFunc() aber unterschiedlichen Funktionsparametern bekommen, also ungefähr:

        for (var index in list)
        {
          var img = document.createElement("img");
          img.setAttribute("src", "http...");
          img.onclick = function()
          {
            testFunc(index)
          }
          parentDiv.appendChild(img);
          .
          .
          .
        }
        Wenn ich das ganze jetzt ausprobiere, haben alle img's in ihren testFunc's den hösten vorkommenden index Wert. Offensichtlich wird bei
        img.onclick = function()
          {
            testFunc(index)
          }
        _allen_ in dieser Schleife erzeugten img Objekten der jeweisl neue Wert zugewiesen.
        Die mit setAttribute zugewiesenen Werte (z.B. src) sind wie gewünscht verschieden.

        Das Problem wurde hier erst vor kurzen angesprochen. Da ist bestimmt auch was für dich dabei!

        mfg. Daniel