Hallo Leute,
Ich möchte ein <select>-Auswahlfeld dynamisch befüllen, und gleichzeitig einen Eventhandler onchange damit verknüpfen. onchange funktioniert super, solange das Feld nicht mit den DOM-Methoden bearbeitet wurde, aber anschließend leider nicht mehr. Wieso nicht? Ich sehe einfach nicht, was da falsch ist:
<html><head><title>Strange</title>
[code lang=javascript]
<script type="text/javascript">
Names = {
Ich: {},
Du: {},
Er: {},
Sie: {},
Es: {}
};
function newNames() {
var newList = document.createElement('select');
for (var theName in Names) {
var opt = document.createElement('option');
opt.value = theName;
opt.innerHTML = theName;
newList.appendChild(opt);
}
var listParent = document.getElementById("tList");
listParent.innerHTML = ""; //Alte Liste löschen
newList.id = "Names";
newList.onchange = "alert('Hey!');";
listParent.appendChild(newList);
// Nur zum Test:
var myNewList = document.getElementById("Names");
alert('onchange ist jetzt: ' + newList.onchange);
}
</script>
</head>
<body>
<div id="tList">
<select id="Names" size="1" onchange="alert('Wow!');">
<option>Heino</option>
<option>Michael Jackson</option>
<option>Tom Waits</option>
<option>Nina Hagen</option>
<option>Marianne Rosenberg</option>
</select>
</div>
<input id="newNames" type="button" value="Neu" onclick="newNames()"></input>
</body>
</html>
[/code]
Gibt es eigentlich eine bessere Möglichkeit ein DOM-Element zu löschen, ausser die innerHML-Eigenschaft auf den Leerstring zu setzen? Den DOM-Elementen fehlt anscheinend sowas wie eine Suicide- oder eine KillChild-Methode.
Danke für jede Hilfe,
Don P