<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>JavaScript: Event-Listening (Internet Explorer)</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta http-equiv="Content-Style-Type" content="text/css">
<meta name="description"
content="Übung JavaScript. Event-Listening">
<meta name="keywords" content="HTML, JavaScript (Internet Explorer)">
<meta name="author" content="Roland Unger">
<script language="JavaScript" type="text/javascript">
function processSingleWord() {
alert("Sie haben auf das rot geschriebene Wort gedr\u00fcckt!");
}
function processParagraph() {
alert("Sie haben auf den \u00fcbergeordneten Absatz gedr\u00fcckt!");
}
function processMouseOverAndOut(event) {
var color;
if (event.type=="mouseover") color="#FFFF00"; else color="#FFFFFF";
event.srcElement.style.backgroundColor=color;
}
function init() {
var aTag;
if (document.getElementById) {
aTag = document.getElementById("s2");
if (aTag.attachEvent) {
aTag.attachEvent("onmouseup", processSingleWord);
aTag = document.getElementById("p2");
aTag.attachEvent("onmouseup", processParagraph);
aTag = document.getElementById("s4");
aTag.attachEvent("onmouseover", processMouseOverAndOut);
aTag.attachEvent("onmouseout", processMouseOverAndOut);
}
else alert("Dieser Browser unterst\u00fctzt keine Ereignisbehandlung des Internet Explorers 5 und 6!");
}
else alert("Dieser Browser unterst\u00fctzt keine Form des Document Object Model und somit auch keine diesbez\u00fcgliche Ereignisbehandlung!");
}
onload = init;
</script>
</head>
<body>
<h2>Übung JavaScript</h2>
<h3>Event-Listening (Internet Explorer)</h3>
<p id="p2">Wenn Sie auf das rot markierte Wort
"<span id="s2" style="color: #FF0000">bubble</span>" drücken,
erhalten Sie mehrere Meldungsfenster. Die Ereignisverarbeitung erfolgt nach dem
Bubbling-Konzept. Bitte achten Sie auf die Reihenfolge des Auftretens der
Meldungsfenster!</p>
<p>Wenn Sie mit der Maus über das rot markierte
"<span id="s4" style="color: #FF0000">Wort</span>" fahren, ändert
sich seine Hintergrundfarbe. Wenn man den Typ des Ereignisses auswertet, braucht man
hierfür nur eine Funktion zu schreiben.</p>
</body>
</html>