matthias: onClick-Attribut dynamisch hinzufügen

Hallo!

Ich habe folgende JavaScript-Funktionen:

-------------------------------

function addTableRow(cellArray, tableId) {
 var newRow = document.getElementById(tableId).insertRow();

for(i=0; i < cellArray.length; i++) {
  var newCell = document.createElement("td");
  if(cellArray[i] == "sCustomerNumber2" || cellArray[i] == "sArticleNumber2") {
   var newSpan = document.createElement("span");
   newSpan.innerHTML = document.getElementById(cellArray[i]).value;
   newAttribute = document.createAttribute("class");
   newAttribute.nodeValue = "ghostlink";
   newSpan.setAttributeNode(newAttribute);
   newAttribute = document.createAttribute("onClick");
   if(cellArray[i] == "sCustomerNumber2") {
    newAttribute.nodeValue = "document.getElementById('sCustomerNumber').value = '" + document.getElementById(cellArray[i]).value + "'";
   } else if(cellArray[i] == "sArticleNumber2") {
    alert("yes");
    newAttribute.nodeValue = "alert('test')";
   }
   newSpan.setAttributeNode(newAttribute);
   newCell.appendChild(newSpan);
  } else {
   var newCellText = document.createTextNode(document.getElementById(cellArray[i]).value);
   newCell.appendChild(newCellText);
  }
  newRow.appendChild(newCell);
 }
}
function addCustomerRow() {
 var cellArray = Array("sCustomerNumber2","sCustomerMatchcode","sCustomerName","sCustomerZip","sCustomerCity","sCustomerCountry");
 addTableRow(cellArray, "customerTable");
}

-------------------------------

Diese fügen zu einer bestehenden Tabelle neue Zeilen aus einem Formular hinzu, wenn die Funktion addCustomerRow() aufgerufen wird.

Nun würde ich noch gerne, dieser neuen Zeile (newRow) ein onClick-Attribut hinzufügen.

Dazu gäbe es ja zwei möglichkeiten:

newRow.setAttribute("onClick","alert('test')","false");

Oder:

newAttribute = document.createAttribute("onClick");
newAttribute.nodeValue = "alert('test')";
newRow.setAttributeNode(newAttribute);

Jedoch funktioniert keine der beiden Arten im IE.
Habe irgendwo gelesen, dass das erste gehen sollte, tut es aber nicht...

Geht es überhaupt irgendwie?

mfg,
matthias

  1. Hallo matthias.

    Dazu gäbe es ja zwei möglichkeiten:

    newRow.setAttribute("onClick","alert('test')","false");

    Oder:

    newAttribute = document.createAttribute("onClick");

    newAttribute.nodeValue = "alert('test')";
    newRow.setAttributeNode(newAttribute);

      
    Oder:  
      
    `newRow.onclick = alert('test');`{:.language-javascript}  
      
      
    Einen schönen Samstag noch.  
      
    Gruß, Ashura  
    
    -- 
    Selfcode: sh:( fo:} ch:? rl:( br: n4:~ ie:{ mo:| va:) de:> zu:) fl:( ss:) ls:[ js:|  
    [30 Days to becoming an Opera8 Lover](http://operalover.tntluoma.com/8/) -- [Opera Mini on Treo](http://operalover.tntluoma.com/8/opera_mini_on_treo)  
    Meine Browser: [Opera 8.02](http://my.opera.com/noctus/affiliate/download/) | Firefox 1.0.6 | Lynx 2.8.5 | Netscape 4.7 | IE 6.0  
    [\[Deshalb frei! - Argumente pro freie Software\]](http://deshalbfrei.org/)
    
    1. newRow.onclick = alert('test');

      stimmt, hab ich vergessen, geht aber leider auch nicht ;)

      1. Hallo matthias.

        stimmt, hab ich vergessen, geht aber leider auch nicht ;)

        „Geht nicht“ ist keine Fehlerbeschreibung.
        Was sagt die (wortkarge) JS-Konsole des IE? Gibt es eine Live-Demo online?

        Einen schönen Samstag noch.

        Gruß, Ashura

        --
        Selfcode: sh:( fo:} ch:? rl:( br: n4:~ ie:{ mo:| va:) de:> zu:) fl:( ss:) ls:[ js:|
        30 Days to becoming an Opera8 Lover -- Opera Mini on Treo
        Meine Browser: Opera 8.02 | Firefox 1.0.6 | Lynx 2.8.5 | Netscape 4.7 | IE 6.0
        [Deshalb frei! - Argumente pro freie Software]
        1. sorry, habs jetzt noch mal anders probiert, und zwar folgendermaßen:

          newRow.setAttribute("onmouseover","this.bgColor='#FF0000'","false");
          alert(newRow.getAttribute("onmouseover"));

          im alert steht nun zwar "this.bgColor='#FF0000'", jedoch funktioniert es nicht, wenn ich über die Zeile fahre...
          mit funktioniert nicht meine ich in diesem fall, es passiert einfach nichts, es gibt auch keine Fehlermeldung

          1. Hallo matthias.

            newRow.setAttribute("onmouseover","this.bgColor='#FF0000'","false");
            alert(newRow.getAttribute("onmouseover"));

            Warum gibst du bei setAttribute drei Attribute an, wo nur zwei angegeben werden (dürfen|müssen)?

            Einen schönen Samstag noch.

            Gruß, Ashura

            --
            Selfcode: sh:( fo:} ch:? rl:( br: n4:~ ie:{ mo:| va:) de:> zu:) fl:( ss:) ls:[ js:|
            30 Days to becoming an Opera8 Lover -- Opera Mini on Treo
            Meine Browser: Opera 8.02 | Firefox 1.0.6 | Lynx 2.8.5 | Netscape 4.7 | IE 6.0
            [Deshalb frei! - Argumente pro freie Software]
            1. Hallo.

              Warum gibst du bei setAttribute drei Attribute an, wo nur zwei angegeben werden (dürfen|müssen)?

              ^^^^^^^^^ - Parameter meinte ich.

              Einen schönen Samstag noch.

              Gruß, Ashura

              --
              Selfcode: sh:( fo:} ch:? rl:( br: n4:~ ie:{ mo:| va:) de:> zu:) fl:( ss:) ls:[ js:|
              30 Days to becoming an Opera8 Lover -- Opera Mini on Treo
              Meine Browser: Opera 8.02 | Firefox 1.0.6 | Lynx 2.8.5 | Netscape 4.7 | IE 6.0
              [Deshalb frei! - Argumente pro freie Software]
            2. Warum gibst du bei setAttribute drei Attribute an, wo nur zwei angegeben werden (dürfen|müssen)?

              hab davor irgendwo gelesen, dass das dritte attribut für die unterscheidung von groß/kleinschreibung ist, auch egal, macht keine unterschied ob ich das weglasse oder nicht

              eigentlich ist es ja auch unlogisch, dass das folgende alert praktisch bestätigt, dass das attribut richtig gesetzt ist!

  2. und hier di lösung:

    newRow.onclick= new Function('xyz','this.bgColor="#D9D9F0"');

  3. Dazu gäbe es ja zwei möglichkeiten:

    newRow.setAttribute("onClick","alert('test')","false");

    Oder:

    newAttribute = document.createAttribute("onClick");
    newAttribute.nodeValue = "alert('test')";
    newRow.setAttributeNode(newAttribute);

    Jedoch funktioniert keine der beiden Arten im IE.
    Habe irgendwo gelesen, dass das erste gehen sollte, tut es aber nicht...

    Geht es überhaupt irgendwie?

    Es gibt 4 Möglichkeiten.
    Die 3. hast du ja schon beschrieben.

    die 4 ist dem Handler direkt die Funktionsreferenz zuzuweisen:

    newAttribute.onclick = function()
    {
    ....
    }

    oder

    newAttribute.onclick = eine_funktion;

    function eine_funktion()
    {
    ....
    }

    und du solltest statt bgColor style.backgroundColor nehmen

    Struppi.