dynamisches Attribut / Eventhandler
Uschi Renziehausen
- dhtml
Liebe Loits,
der IE hat mich nicht lieb und ich ihn nach stundenlangem rumprobieren auch nicht.
Ich möchte einem dynamisch erzeugtem Element einen Eventhandler verpassen, die aufzurufende Funktion benötigt Parameter. Also fällt sowas wie addEventListener() oder attachEvent() aus.
Deshalb habe ich el.setAttribute("eventhandler", "functionsname('parameter')") verwendet.
Unter nn6/mozi klappts wunderbar, aber der ie stellt sich stur, absolut stur.
Anbei eine kleine Beispieldatei, die unter anderem zeigt, dass der IE bei getAttribute("eventhandler") was anderes zurückgibt als netscape, nämlich ein merkwürdiges function anonymous() {functionsname(parameter)}:
<html>
<head>
</head>
<body>
<script language="JavaScript">
function myFunction(text) {
alert(text);
}
el = document.createElement("div");
document.getElementsByTagName("body")[0].appendChild(el);
el.setAttribute("id","myDiv");
el.style.width = "100px";
el.style.height = "100px";
el.style.backgroundColor = "#000000";
el.setAttribute("onclick","myFunction('huhu')");
</script>
<div onclick="alert(getAttribute('onclick'))">Wert von onclick anzeigen</div>
</body>
</html>
Kann mir jemand aus der Patsche helfen, bitte?
Liebe Grüße, Uschi
Hallo,
Anbei eine kleine Beispieldatei, die unter anderem zeigt, dass der IE bei getAttribute("eventhandler") was anderes zurückgibt als netscape, nämlich ein merkwürdiges function anonymous() {functionsname(parameter)}:
<div onclick="alert(getAttribute('onclick'))">Wert von onclick anzeigen</div>
Du fragst doch hier das aktuelle DIV ab, also das mit dem Index 1:
<div onclick="alert(document.getElementsByTagName('div')[1].getAttribute('onclick'))">Wert von onclick anzeigen</div>
Das neu erzeugte macht im IE ebenfalls keine Probleme:
<div onclick="alert(document.getElementsByTagName('div')[0].getAttribute('onclick'))">Wert von onclick anzeigen</div>
Oder habe ich etwas falsch verstanden?
MfG, Thomas
Gugucks Thomas,
das mit dem Anzeigen des Attributwerts war nur so am Rande. Das eigentlich Problem liegt darin, daß das schwarze div onclick in NN6 artig ein huhu alerted, im ie aber nicht.
Um zu gucken woran das liegen könnte habe ich dann einen hardcodierten eventhandler im zweiten DIV gebastelt. Fakt ist: NN6 und IE geben auch bei den hardcodierten unterschiedliche Werte bei getAttribute() zurück, was ja wohl das brüderchen von setAttribute() sein sollte.
liebe Grüße, Uschi
Hallo,
das mit dem Anzeigen des Attributwerts war nur so am Rande. Das eigentlich Problem liegt darin, daß das schwarze div onclick in NN6 artig ein huhu alerted, im ie aber nicht.
Auch im IE wird das DIV mit allen Attributen erzeugt, was alert(document.documentElement.outerHTML); beweist ... 's_ onclick_t' aba nicht ...
MfG, Thomas
genau Thomas, jetzt hast du das Problem erfaßt. Es soll aber klicken, dass ist es ja gerade.
Es tuts aber nicht, und das offenbar deswegen, weil dieses dämliche function anonymous drumrum fehlt.
Solche Probleme gibts mit dem IE ja öfter, zum Beispiel beim Erzeugen von Tabellen. Wenn du mit document.createElement("table") eine Tabelle erzeugst, dann MUSST du für den IE erstmal noch ein tbody basteln, während Netscape 6 das automatisch tut.
Im IE scheinen zahlreiche Geheimnisse versteckt. Intern braucht der offenbar dieses function anonymous.
Zum Thema outerHTML: Ich habe eben gerade festgestellt, dass die Klickerei funktioniert, wenn ich mein Element erst erzeuge und ins DOM hänge und dann mit outerHTML den Code zusammenbastle. Aber ne saubere Lösung ist das wahrlich nicht.
Uschi -- die jetzt leider Studenten quälen muss. Wäre schön, wenn sich ne andere Lösung fände.
bis spädda Uschi
Hallo,
genau Thomas, jetzt hast du das Problem erfaßt.
Fein ;-).
Zum Thema outerHTML: Ich habe eben gerade festgestellt, dass die Klickerei funktioniert, wenn ich mein Element erst erzeuge und ins DOM hänge und dann mit outerHTML den Code zusammenbastle. Aber ne saubere Lösung ist das wahrlich nicht.
Hm, diese eine (letzte) Zeile aktiviert offenbar den Code:
//...
el.setAttribute("onclick","myFunction('huhu')");
if(el.outerHTML)el.outerHTML=el.outerHTML;
Ein nicht uninteressantes Ergebnis.
MfG, Thomas
gugucks, rä von unität,
Hm, diese eine (letzte) Zeile aktiviert offenbar den Code:
//...
el.setAttribute("onclick","myFunction('huhu')");
if(el.outerHTML)el.outerHTML=el.outerHTML;
Ein nicht uninteressantes Ergebnis.
Da hast du wohl recht. Aber ich kann mir nicht helfen, ich wüßte nun wirklich gern, was outerHTML mit dem outerHTML macht. IE-Selbstbefriedigung oder auch: der eigentliche Kick kommt vom innerlichen Äußeren.
Vielleicht findet sich ja noch jemand, der die Microsoft-Doku auswendig kann und meine Neugier befriedigt. Auch son Kick, klick.
Uschi
Hi Uschi,
die aufzurufende Funktion benötigt Parameter.
zwingend? Keine Chance, die benötigten Informationen via "this" zu
addressieren oder als globale Variablen zu speichern?
Viele Grüße
Michael
Hallo Michael,
die aufzurufende Funktion benötigt Parameter.
zwingend? Keine Chance, die benötigten Informationen via "this" zu
addressieren oder als globale Variablen zu speichern?
Deine Frage ist gar nicht so einfach zu beantworten. Unumgänglich sind die Parameter wohl nicht, aber mit ist sehr viel praktischer und wohl auch billiger. Allgemein ist es jedenfalls nützlich zu wissen, wie eine Funktion mit Parametern dynamisch eingebaut werden kann, und es geht ja auch, trotz des IE-Bugs.
Via this scheint mir problematisch. Denn auch this müßte ja als Parameter übergeben werden, oder aber, ich müßte in der Handler-Funktion erst mal rausfinden, welches HTML-Element gefeuert hat (ich weiß nicht wie das geht, aber das ließe sich ja rausfinden) und ohne dann vielleicht über ein Namenskonzept arbeiten. Das mit den globalen Variablen wäre natürlich auch eine Variante, aber gefallen tut mir die nicht. Das würden unter Umständen nämlich sehr viele werden, und das alles nur, weil keine Parameter übergeben werden können.
liebe Grüße, Uschi
Hallo Uschi,
Via this scheint mir problematisch. Denn auch this müßte ja als
Parameter übergeben werden, oder aber, ich müßte in der Handler-Funktion
erst mal rausfinden, welches HTML-Element gefeuert hat
wenn Du nichts anderes tun willst, als dieses Element zu manipulieren,
dann solltest Du genau _das_ eben _nicht_ herausfinden müssen, weil Du
dieses Element von innerhalb der Funktion mit "this" ansprechen kannst
... oder?
(Dachte ich jedenfalls ... so ganz schlau bin ich aus dem entsprechenden
SelfHTML-Kapitel allerdings auch nicht geworden. Laß Dir doch mal mit
"alert()" den Wert von "this" in Deiner Funktion ausgeben ...)
Das mit den globalen Variablen wäre natürlich auch eine Variante, aber
gefallen tut mir die nicht.
Ich kann nicht beurteilen, wer der logische "Besitzer" der derzeit als
Parameter übergebenen Informationen ist.
Gehören diese Informationen zu einem DOM-Objekt, dann wäre eine globale
Variable dafür in der Tat nicht so schön.
Sollen diese Informationen aber beispielsweise nur einen allgemeinen
Verarbeitungszustand beschreiben, dann "gehören" sie meiner Meinung nach
der Seite und dürften durchaus als globale Variablen abgelegt werden.
Ich wollte also lediglich das verwendete Datenmodell inhaltlich hinter-
fragen (ohne dessen Anwendung selbst bisher zu verstehen).
Wenn dort bereits alles so ist, wie es sein muß, dann betrachte meinen
Einwand als irrelevant.
Viele Grüße
Michael
Hallo Uschi,
Ich möchte einem dynamisch erzeugtem Element einen Eventhandler verpassen, die aufzurufende Funktion benötigt Parameter. Also fällt sowas wie addEventListener() oder attachEvent() aus.
Deshalb habe ich el.setAttribute("eventhandler", "functionsname('parameter')") verwendet.
function myFunction(text) {
alert(text);
}
el.setAttribute("onclick","myFunction('huhu')");
Da hat der IE wohl einen Bug.
Es geht aber:
el.onclick=function(){alert('huhu')};
oder:
el.onclick=new Function("alert('huhu')");
Auch hier erzeugt IE jeweils diese "function anonymous()", die aber wohl nur intern eine Rolle spielt.
Grüße, Stefan