Hi,
ich habe hier ein Problem bei einem Mouseover. Ich arbeite mit fromElement und toElement um das Bubbling abzufangen. Befindet sich in der Unterstruktur ein Inputfeld und verlasse ich dieses mit der Maus wird ein Mouseover gemeldet, bei dem die Maus aus einem Div Element kommt das eigentlich gar nicht existiert und auf dessen Attribute man nicht zugreifen kann. Jeglicher Versuch das unbekannte Element aufzufinden ist gescheitert, obwohl es laut element.contains voprhanden ist. Ich denke das hier irgendwo ein implizietes DIV in den Baum gesetzt wird, warum aber? Die Seite ist XHTML strict valide und somit sollte auch der DOM Baum valide sein sollte.
Ich habe hier mal ein reduziertes Beispiel, in diesem arbeite ich mit einem UL als übergeordnetes Objekt (mit divs daselbe Problem). Im ganzen Code gibt es kein div. Warum also die Exception "Fehler: uncaught exception: Die Erlaubnis für das Lesen der Eigenschaft HTMLDivElement.id wurde verweigert"?
<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Test</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<script type="text/javascript">
//<![CDATA[
function over(event) {
event = event || window.event;
var fromElement = event.relatedTarget || event.fromElement || false;
document.getElementById('debug').innerHTML += "<br>";
document.getElementById('debug').innerHTML += fromElement.id;
}
//]]>
</script>
<style type="text/css">
img { display: block; border: 0; width: 95px; height:20px; background-color:gray}
li {list-style:none inside}
</style>
</head>
<body id="body" onload="document.getElementById('ul').onmouseover = over;">
<ul id="ul">
<li id="li1"><a href=""><img id="img1" alt="" src="" /></a></li>
<li id="li2"><form id="form" action="" method="post">
<p id="p" style="display:inline">
<input id="input" name="" type="text" style="width: 91px;"/>
</p>
</form></li>
<li id="li3"><a href=""><img id="img2" alt="" src="" /></a></li>
</ul>
<p id="debug"></p>
</body>
</html>